Question

我有一个v-data-table，其中包含这样的项目

<v-data-table :items="items" ...>
 <template slot="items" slot-scope="props">
   <td>{{props.index}}</td>
   <td>{{props.name}}</td>
  </template>
</v-data-table>

有20多个项目，我正在尝试维护行索引。当我使用props.index时，即使我更改了分页，它始终显示0-5。即使我更改了分页，如何保持该增量索引呢？

Answer 1

通常，您将拥有pagination.sync到本地数据属性，然后可以将当前索引计算为

(pagination.page - 1)* pagination.rowsPerPage + props.index

您的分页对象：

{
  descending: boolean
  page: number
  rowsPerPage: number // -1 for All
  sortBy: string
  totalItems: number
}

Demo on codepen

Vuetify-在v-data-tale中维护行索引

1 个答案: