Vue.js Vuetify动态加载数据表行

我有一个像这样的vuetify数据表

<v-data-table :items="items" :headers="headers" :search="search">
            <template slot="items" slot-scope="props">
              <td>{{props.item.id}}</td>
              <td>{{props.item.make}}</td>
              <td>{{props.item.year}}</td>

            </template>
          </v-data-table>

相反，我想要的是使用v-for加载这些td元素

我试过了

{{props.item.i.text}

如何在vuetify中执行此操作。我的vuetify版本也是1.5.5

这是我的密码笔

---

尝试以下模板：

<div id="app">
  <v-app>
    <v-content>
      <v-container>
        <v-data-table :items="items" :headers="headers" :search="search">
            <template slot="items" slot-scope="props">
              <template v-for"column in headers">
                <td>{{ column.text }}</td>
              </template>
            </template>
          </v-data-table>
      </v-container>
    </v-content>
  </v-app>
</div>

<template slot="items" slot-scope="props">
   <td v-for="(prop, key) of spreadItem(props.item)" 
       :key="key"
       :v-text="prop" />
</template>

并且，在模板中：

<div id="app">
  <v-app>
    <v-content>
      <v-container>
        <v-data-table :items="items" :headers="headers" :search="search">
            <template slot="items" slot-scope="props">
              <template v-for"column in headers">
                <td>{{ column.text }}</td>
              </template>
            </template>
          </v-data-table>
      </v-container>
    </v-content>
  </v-app>
</div>

<template slot="items" slot-scope="props">
   <td v-for="(prop, key) of spreadItem(props.item)" 
       :key="key"
       :v-text="prop" />
</template>

更新。当一些项目有额外的道具时，这将不会添加额外的单元格，除非您将它们添加到spreadItem方法和标题中，当然，在这种情况下，它们将显示为额外的列。

您可以在v-for中使用，如下所示

<td v-for="(key,index) in Object.keys(props.item)" :key="index">{{props.item[key]}}</td>

运输署{ 边框底部：1px实心ccc； } {{props.item[key]}