数据和展示

数据表过滤是关键功能，用户可以很快找到他们寻找的数据。

筛选示例

这些示例演示了您可以利用 search 属性进行结果筛选的各种方式。

搜索

数据表提供了一个 search 属性，允许您对数据进行筛选。

可过滤

您可以通过在表头项上将 filterable 属性设置为false来轻松地禁用特定列在搜索表行时被包含。在下面的示例中，甜点名称列不再可搜索。

自定义过滤器

您可以通过将函数提供给 custom-filter 属性来覆盖使用 search 属性的默认过滤器。您可以在下面看到函数的签名。

(value: string, query: string, item?: any) => boolean | number | [number, number] | [number, number][]

在下面的示例中，自定义过滤器只匹配完全大写的输入。

分页示例

分页用于将大量数据分割成较小的块。

外部分页

分页可以通过使用各个单独的属性或使用 options 属性来进行外部控制。请记住你必须使用 .sync 修饰符。

选择示例

选择允许您选择/取消选择行，并获取有关已选择哪些行的信息。

项目值

要使选择功能正常工作，数据表必须能够区分数据集中的每一行。这是通过使用 item-value 属性来完成的。它指定了项目中应包含唯一值的属性。默认情况下，它搜索的属性是 id。

您还可以提供一个函数，例如，如果唯一值需要由多个属性组合而成。该函数的第一个参数是每个项目。

选定的值

数据表的当前选择可以通过 v-model 属性访问。数组将包含您使用 item-value 属性设置的属性中找到的唯一值（或通过传递的函数返回的值）。如果希望数组由实际对象组成，可以使用 return-object 属性。

可选择行

使用 item-selectable 属性来指定您的项目中控制项目是否可选择的属性。

选择策略

数据表支持三种不同的选择策略。

策略	描述
'single'	只能选择单行。标题中的全选复选框不会显示。
'page'	可以选择多行。单击标题中的全选复选框将选择当前页面上的所有（可选择的）行。
'all'	可以选择多行。单击标题中的全选复选框将选择整个数据集中的所有（可选择的）行。

排序示例

数据表可以按列值对行进行排序。

基本排序

表格的排序可以通过 sort-by 属性来控制。该属性接受一个对象数组，其中每个对象具有 key 和 order 属性，描述了表格的排序方式。

key 对应于在 headers 数组中定义的列，order 是字符串 'asc' 或 'desc'，表示项目排序的顺序。

除非你使用下面看到的 multi-sort 属性，否则这个数组几乎总是只有一个对象。

多列排序

使用 multi-sort 属性将使您能够同时在多个列上进行排序。

按原始数据排序

TIP

此特性自 v3.5.0 (Polaris) 版本引入。

在你的表头对象中使用 sortRaw 键可以让你访问到项目中的所有值。如果你想要按照不在表中显示的值或多个值的组合进行排序，这将非常有用。