当我们单独使用el-table时,select-all事件是可以正常触发的;但是当我们结合分页器一起使用且数据源如下图代码时,点击全选的checkbox就会被触发2次,从而出现每次点击的结果都是true。
解决该问题关键是不要直接计算data数据源,而是先用computed计算出来。如下代码所示:
// currentPage:分页器当前页码
// pageSize:每一页的数据条数
computed: {
tableDataList() {
return this.tableData.slice((this.currentPage - 1) * this.pageSize, this.currentPage*this.pageSize)
}
},
数据源对应的切换:
此时,el-table表格的select-all全选操作就可以正常触发,样式也会对应显示了。