PrimeVue DataTable

Question

如果我将:lazy="true“添加到，如下所示：

<DataTable :value="cars" :lazy="true" :filters="filters" :paginator="true" :rows="10"
    :totalRecords="totalRecords" sortMode="multiple" :loading="loading" @page="onPage($event)">

列筛选和排序不起作用

示例代码：https://www.primefaces.org/primevue/#/datatable/filter

如何使用:lazy as true进行筛选和排序？

乔比

Answer 1

您需要为每个包含数据的列配置一条规则，例如一个学生表( id，name)，并在:globalFilterFields中添加关联列的json字段属性名称。

<Datatable :filters="filters" :globalFilterFields="[ 'id', 'name' ]">
  <Column field="id" header="ID"/>
  <Column field="name" header="Name"/>
</Datatable>

...

const filters = ref({
  global: { value: null, matchMode: FilterMatchMode.CONTAINS},
  id: { value: null, matchMode: FilterMatchMode.EQUALS},
  name: { value: null, matchMode: FilterMatchMode.CONTAINS},
});

这样，您将告诉DataTable使用定义的规则过滤列Id和名称，只需记住使用正确的mactchMode来过滤数字、日期或字符串，FilterMatchMode.CONTAINS与字符串一起使用。