Javascript Vue.js b-table插槽未正确显示

我的Vue引导表未正确呈现插槽

如果我将网站的示例复制到我的Vue应用程序，则不会呈现插槽。应用程序编译时没有错误。 某些插槽（例如，工作台繁忙）正常工作，但其他插槽则不正常

<template>
<b-table
  :fields="tableHeaders"
  :items="tableRows"
  :busy="!tableLoaded"
>
  <template v-slot:cell()="data">
    <i>{{ data.value }}</i>
  </template>
</b-table>
</template>

<script>
export default {
  data() {
    tableHeaders: [
      {
        key: 'Employee',
        stickyColumn: true,
        isRowHeader: true,
        variant: 'primary',
      }, 
      'Status'
    ],
    tableRows: [
      Employee: 'Emp 1', status: 'Active',
      Employee: 'Emp 2', status: 'Active',
    ]
}
</script>

{{data.value}}
导出默认值{
数据（）{
表格标题：[
{
关键字：“员工”，
stickyColumn：对，
isRowHeader:对，
变体：“主要”，
}, 
“地位”
],
表格行：[
员工：“Emp 1”，状态：“活动”，
员工：“Emp 2”，状态：“活动”，
]
}

---

数据值不会以斜体字体显示。编译器不会显示任何错误。有人知道如何解决此问题吗？

确保您使用的是最新版本的BootstrapVue

2.0.4

。

2.0.0-rc

版本对表单元格插槽使用了不同的命名语法。请确保您使用的是最新版本的BootstrapVue

2.0.4

。

2.0.0-rc##

版本对表格单元格插槽使用了不同的命名语法。