Question

支持用户创建/删除动态数据表的功能，该表将保留在后端。


// statically typed data table
    <v-data-table
        :pagination.sync="pagination"
        :headers="headers"
        :items="items"
        class="elevation-1"
      >
        <template v-slot:items="props">
          <td>{{ props.item.name }}</td>
          <td class="text-xs-right">{{ props.item.column1 }}</td>
          <td class="text-xs-right">{{ props.item.column2 }}</td> 
          <td class="text-xs-right">{{ props.item.column3 }}</td>
          <td class="text-xs-right">{{ props.item.column4 }}</td>
          </td>
        </template>
      </v-data-table>

但是我的情况是：

<template v-for="table in tables">
    //where table will be a new <v-data-table> component with arbitrary rows 
</template>

此外，这些数据表将具有实时更新，因此我必须以某种方式将每个数据表状态与vuex链接以增强反应性。

Answer 1

这里是您第一步的链接，只需结合v-for和v-data-table。

https://codepen.io/anon/pen/QRXyBg?editors=1010

并遍历tables属性。您可以共享headers。如果您需要动态/反应性数据，只需从tables或其他一些地方更新methods属性。

如何动态呈现不同数据表的列表

1 个答案: