引导Vue：如何获取动态表头？

Question

目前正在使用引导vue。我需要生成b-table，但是使用从api获得的动态头值，我不确定如何执行此操作。

我已经尝试了在数据中设置字段的常规方法，但若我尝试设置计算字段，我的表中并没有得到任何值`

computed: {
    fields () {
      return ['date', ...this.scheduler.times]
    }
  }

`

。调度程序。times是从包含如下数组的api接收的数据。此外，此阵列还可以添加更多次（来自api的数据）`

[
    {
        "id": 1,
        "start": "01:30:00",
        "end": "09:30:00"
    },
    {
        "id": 2,
        "start": "10:00:00",
        "end": "13:00:00"
    }
]

`

预期的结果是，我从api中获得了带有时间的列标题，并添加了日期列。

我可以使用时刻生成一系列的日期，但不确定如何将此映射到b表

任何帮助都将不胜感激。谢谢

Answer 1

我认为这是你正在寻找的东西：

<b-table :items="items" :fields="fields">
    <template v-for="field in dynamicFields" v-slot:[`cell(${field.key})`]="{ item }">
</b-table>

在脚本中：

this.dynamicFields.push({key: 'someTestKey', label: '1:30AM - 2:30AM'})