【发布时间】:2026-01-16 18:00:02
【问题描述】:
我正在尝试使用两个过滤器设置基本服务器端vue-tables-2 - 一个是下拉列表,另一个是搜索字段。我无法检测到requestFunction() 中应用了两个过滤器中的哪一个,因此我可以向服务器发送请求。目前,我只是尝试在应用过滤器/更改输入时控制台记录输入过滤器名称和值。
JSFiddle:
https://jsfiddle.net/kbpq5vb3/39/
HTML
<h1 class="vue-title">Vue Tables 2 Demo</h1>
<div id="app">
<v-server-table url="https://jsonplaceholder.typicode.com/users" :columns="columns" :options="options"></v-server-table>
</div>
VueTable:
Vue.use(VueTables.ServerTable);
new Vue({
el: "#people",
data: {
columns: ['name', 'username'],
options: {
requestAdapter(data) {
console.log(data.query); // detect which filter was applied / which input changed
},
responseAdapter(resp) {
return {
data: resp,
count: resp.length
}
},
filterByColumn: true,
filterable: ['name', 'username'],
listColumns: {
name: [{
id: 'ervin',
text: 'Ervin'
}, {
id: 'chelsey',
text: 'Chelsey'
}]
}
}
}
});
【问题讨论】:
-
根据documentation,
vue-tables.filter / tableName/FILTER在过滤器更改时触发。 -
您应该能够在右侧的“事件”选项卡下的 Vue 开发者工具中查看该事件。
-
@Derek 谢谢。是的,我看到了,但是我尝试实现它没有成功,因为我需要在请求适配器中访问该事件并且文档很差,因为它不包含任何有关如何正确使用它的示例。你明白它是如何工作的吗?你能用一个基本的例子来更新小提琴吗?
标签: javascript vue.js vuejs2 vue-tables-2