PrimeVue DataTable滤波器

Question

我正在尝试使用DataTable向来自3.3.0版本的PrimeVue的新过滤器特性添加过滤器。

过滤器似乎被添加到表中，但是筛选器输入没有正确显示。

我怀疑我可能失去了一种依赖，以下是我目前的一些：

"dependencies": {
  "primeicons": "^4.1.0",
  "primevue": "^3.3.0",
  "vue": "^3.0.5",
  "vue-router": "^4.0.3"
}

代码示例：

<DataTable :value="anArray" :paginator="true" :rows="5"
    paginatorTemplate="CurrentPageReport FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown"
    :rowsPerPageOptions="[5, 10, 15, 20]"
    currentPageReportTemplate="Documents {first} à {last} sur {totalRecords}"
    v-model:filters="filters"
    filterDisplay="row">
    <Column field="sujet" header="Sujet">
        <template #filter="{ filterModel, filterCallback }">
            <InputText type="text" v-model="filterModel.value" @input="filterCallback()" class="p-column-filter" />
        </template>
    </Column>
</DataTable>

<script>
import { FilterMatchMode, FilterOperator } from "primevue/api";

export default {
  data() {
    return {
      filters: {
        global: { value: null, matchMode: FilterMatchMode.CONTAINS },
        sujet: { value: null, matchMode: FilterMatchMode.CONTAINS },
      },
    };
  },
};
</script>

我尝试使用过滤器的“菜单”显示，但输入也缩小到零。

我还尝试删除分页，使用v-model=“filters‘’sujet”，更改matchMode，使用占位符，删除“p列过滤器”类，.到目前为止，没有任何影响。

那么，我是不是忘了这个例子的一个重要部分？我失去了依赖吗？

Answer 1

没关系，这个问题是特定于InputText组件的，它不是在main.js中导入的。