bootstrap-vue 2 b-table slots stopped working

Question

I'm using the b-table component and I have 3 columns that I want to customize using slots.

The following code worked for me a in the past but recently it stopped working although nothing regarding the code, component, package versions changed.

<b-table
            class="tableWidth"
            sticky-header
            striped
            hover
            :items="tableData"
            :fields="tableColumns"
        >
            <template v-slot:cell(certificationType)="row">
                <b-form-group :style="{ width: '80%' }">
                    <b-form-select
                        plain
                        v-model="row.item.certificationType"
                        :options="certificationTypes"
                    ></b-form-select>
                </b-form-group>
            </template>
            <template v-slot:cell(studentRank)="row">
                <b-form-group :style="{ width: '80%' }">
                    <b-form-select plain v-model="row.item.studentRank" :options="Ranks"></b-form-select>
                </b-form-group>
            </template>
            <template v-slot:cell(selected)="row">
                <b-form-checkbox
                    v-model="row.item.selected"
                    name="checkbox-1"
                    :value="true"
                    :unchecked-value="false"
                />
            </template>
        </b-table>

The error the console prints:

Property or method "row" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.

and

Error in render: "TypeError: Cannot read property 'item' of undefined"

Any ideas what could have happened?

Answer 1

As confirmed in the comments on the question, the problem was to do with the version of Vue being used.

The v-slot syntax was introduced in the 2.6.0 release of Vue, meaning if you are using a lower version the errors above will appear. As it doesn't know the row variable is coming from the slot, but instead thinks it should be available in the component instance.

Updating to 2.6.0 or later should fix the issue.