element-ui Table组件实现表格多选当前页切换时多选状态依旧保留

在使用table组件时会遇到以下情况:
1.表格多选时如果存在分页,当点击下一页后再次返回当前页时选中状态没有保留下来。
2.如果当前页的弹窗显示时,表格的勾选状态会被取消。

解决上述两个问题需要用到table组件中的两个属性:reserve-selection和row-key,使用方法如下图所示:

row-key.png

附上代码:

<el-table
  :row-key="(row)=>{ return row.id}"
  :row-class-name="tableRowClassName"
   @selection-change="handleSelectionChange">
   <el-table-column type="selection" width="100px" :reserve-selection="true"></el-table-column>
</el-table>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容