今天和大家一起学习一个 el-table 分页全选的功能
我们在用 el-table 组件的时候,肯定会用到分页功能,不管是长列表下拉分页还是用 element-UI 的 el-pagination 分页。
但是我们在具有选择功能的 el-table 的时候,会遇到一个问题,在点击进行分页之后,之前选择的数据没了,这个问题真的是困扰我良久。
在后面的我又开始面向百度开发,找到一个没有 bug 的方法这个方法是:
在 el-table 中,通过 @selection-change=“handleRowSelection” 和 :row-key=“getRowKeys”,
在第一行,也就是多选框的那一列上,加上 :reserve-selection=\"true\", 直接上代码,仅供大家参考。
{{
(pageInfo.pageNo - 1) * pageInfo.pageSize + scope.$index + 1
}}
源码附件已经打包好上传到百度云了,大家自行下载即可~
链接: https://pan.baidu.com/s/14G-b...
提取码: yu27
百度云链接不稳定,随时可能会失效,大家抓紧保存哈。
如果百度云链接失效了的话,请留言告诉我,我看到后会及时更新~
开源地址
码云地址:
http://github.crmeb.net/u/defu
Github 地址:
http://github.crmeb.net/u/defu