Vuetify 数据表分组与分页未按预期工作

Posted 2023-02-23

【中文标题】Vuetify 数据表分组与分页未按预期工作

【英文标题】：Vuetify data table grouping with paging not working as expected

【发布时间】：2020-12-14 03:18:41

【问题描述】：

当组标题折叠时，Vuetify 数据表分组似乎无法正确处理分页。如果要折叠所有组页眉，则必须翻页显示为空页，直到到达下一个组页眉。

Codepen example

<v-data-table
      :headers="headers"
      :items="stocks"
      item-key="name"
      sort-by="name"
      group-by="sector"
      class="elevation-1"
    ></v-data-table>

折叠第一个标题后，我认为下一个组标题会出现足够的行来填充页面。相反，您必须翻阅几个“空”页（页数对应于第一个分组中的行数）。如何配置在我折叠上一个分组时将下一个分组显示在视图中的分组？

【参考方案1】：

是的，这很烦人。有一个未解决的问题：https://github.com/vuetifyjs/vuetify/issues/13754

您可能知道，“解决方法”是禁用分页（或分组）。如果你有一个大表性能会很差 - 这就是你首先使用分页的原因。