项目场景:
el-table实现跨页面选中
问题描述:
el-table里的@selection-change事件,正常选中的时候只能单页面多数据选中,跨页面后默认重新调用了selection-change事件,所有选中数据被清除
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
@sort-change="onSortChange"
@selection-change="hanleSelect"
:row-key="getRowKey"
><el-table-column type="selection" :reserve-selection="true"></el-table-column></el-table>
hanleSelect(val){
console.log(val)
},
getRowKey(row){
return row.id
},
原因分析:
表格变动会触发选中事件
解决方案:
按照官方文档提示,给
el-table-column添加:reserve-selection="true"属性,注意,该属性需要给el-table配置:row-key属性,实现方法很简单,但是很少会主动注意到该解决方式