获取 Vuetify 数据表中过滤项的长度

Question

有什么方法可以获取 Vuetify 数据表中过滤项的长度？当行被过滤时，显示项目的长度明显减少，我需要知道过滤后有多少项目，因为我需要更新我的外部分页组件。

Answer 1

假设您使用的是 vuetify 2.2.x，您可以使用 v-data-table 的分页事件。

<v-data-table
 @pagination="yourMethod"
...

调用你的方法

methods: {
  yourMethod(pagination) {
    console.log(pagination.itemsLength) // length of filtered/searched items in Vuetify data-table
  },

pagination 事件传递给 yourMethod 的 pagination 参数包含以下信息：

{
  page: number
  itemsPerPage: number
  pageStart: number
  pageStop: number
  pageCount: number
  itemsLength: number
}