javascript - Quasar Q-Table 如何获得过滤或排序的行？

Question

我被卡住了，我安装了 Quasar 2.0.0 版，但它没有一个属性来获取过滤或排序的行。在以前版本的 q-table 中，它有一个 ComputeRows 属性，但在最新版本中它没有。 t我正在尝试向 q 表添加新功能，例如突出显示聚焦行并启用键盘功能以允许内联编辑等...所以我需要知道行数据(模型)及其相应的 html 行。

• 类星体版本:2.0.0
• Vuejs 3
• typescript

Answer 1

有一种未记录的方式来访问 computedRows和computedRowsNumber我在广泛的 Google 搜索后才找到的属性...

1. 为您的表格提供引用:<q-table ref="table" />
2. 通过 ref 访问这些属性:
   • this.$refs.table.computedRows
   • this.$refs.table.computedRowsNumber

这是在 v2.0.0-beta.9 中添加的_{(2021 年 3 月 8 日)}

说明

computedRows -- 为您提供当前页面上显示的行

• 示例:如果总共有 30 个结果，但当前页面中只显示 10 个，则这只会返回这 10 行 - 想要全部吗？请参阅filteredSortedRows

filteredSortedRows -- 为您提供所有跨所有页面显示的行

• 示例:如果总共有 50 行，但有 30 行与过滤后的文本匹配并显示，并且每页显示 10 行，则这将返回所有过滤后的 30 行。如果没有过滤的文本，那么这将返回所有原始 50 行

computedRowsNumber -- 为您提供所有页面中显示的总行的长度

• ^{与 filteredSortedRows.length 相同}

启用服务器端数据获取后，上述属性的行为可能会有所不同。我必须检查源代码才能发现这一点，但尚未在实践中对此进行测试。

Source | Where I found it