- 58
- 0
vue element-ui el-table表格筛选存在分页时只能筛选当前页数据
参考了一下https://segmentfault.com/q/10...
但是描述有点不清晰,说的大概是是通过filter-change拿取当前筛选列以及筛选传递的value值,然后自定义filter.但是这样又怎么去改变表格数据tables以及页数呢
相关代码
//表格数据绑定tables为自定义compute筛选,筛选搜索框输入值
:data="tables.slice((pageIndex-1)pageSize,pageIndexpageSize)"
@filter-change="filterChange"
//methods
filterChange(a){
// console.log(a); //Object { "el-table_3_column_28": (1) […] }
let tableData = this.classBook;
for(let i in a){
// console.log(i+':'+a[i])
return tableData.filter(dataNews => {
return String(dataNews[i]).toLowerCase().indexOf(a[i]) > -1
})
}
console.log('aaaaaa'); //无法打印
console.log(tableData); //无法打印
// return tableData;
},
//tables
if (search) {
return tableData.filter(dataNews => {
return Object.keys(dataNews).some(key => {
return String(dataNews[key]).toLowerCase().indexOf(search) > -1
})
})
}
return tableData
0
打赏
收藏
点击回答
您的回答被采纳后将获得:提问者悬赏的 11 元积分
- 共 0 条
- 全部回答
-
微信昵称女繁体字 普通会员 1楼
在 Vue Element UI 中,表格筛选器的分页功能是基于全局搜索的,也就是说,用户在筛选器中输入了关键词,Vue Element UI 会遍历所有表单项并查找与关键词匹配的数据。如果当前页数据已经超过了当前页的页数,那么筛选器将无法更新。
要解决这个问题,您可以尝试以下方法:
-
使用懒加载:在表单项验证完成后,对筛选器进行分页。
-
使用分页插件:Vue Element UI 提供了一些内置的分页插件,例如:v-loading 和 v-page。您可以根据需要选择合适的插件。
-
使用路由分页:如果您希望用户可以从某个特定路由开始筛选,您可以使用路由分页。在这种情况下,您可以将筛选器与路由进行集成,例如:
```html
```
在
handleRowClick中,您可以处理筛选器中出现的分页事件,并根据分页状态更新筛选器。 -
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
