el-table保留勾选的数据(分页、刷新数据)

1.在el-table中添加行标识 :row-key="val => val.id",这里最好选择能唯一标识每一行的数据作为key的返回值,否则回选失败

html 复制代码
<el-table :row-key="val => val.id" :data="tableList" border style="width: 100%" @selection-change="handleSelectionChange">

2.在复选框那列加上这个属性:reserve-selection="true"

html 复制代码
<el-table-column :reserve-selection="true" type="selection" width="55"></el-table-column>

完整代码:

html 复制代码
#html:
<el-table :row-key="val => val.id" @selection-change="handleSelectionChange" :data="tableList">
	<el-table-column type="selection" :reserve-selection="true" width="55" />
</el-table>
#js:
<script>
export default {
	data() {
		return {
			selExpertList:[],
		};
	},
	methods: {
		handleSelectionChange(selection) {
		this.selExpertList = JSON.parse(JSON.stringify(selection));
		},
	},
};
</script>
相关推荐
10岁的博客7 分钟前
Chrome 扩展安全攻防实录:从权限模型到真实漏洞复盘
前端·chrome·安全
QianhangQianping21 分钟前
WebSocket实时推送+ HTTP 定时轮询:一块大屏两套取数怎么不打架
前端·websocket·网络协议·http·低代码·架构·数据可视化
小郎君65827 分钟前
(六)el-cascader 的展示值为什么不能直接 join:emitPath、路径还原与多选去重
vue.js·算法
Eider199828 分钟前
Python基础知识之并发相关-2
开发语言·前端·python
用户693717500138431 分钟前
AI 能写代码,但工程架构还是应该由人来定
前端·后端
Hilaku38 分钟前
前端的技术判断力是怎么练出来的?
前端·javascript·程序员
悠仁さん41 分钟前
【C++】set map 使用
java·前端·c++
用户0936717554144 分钟前
用 4500 行 TypeScript 复刻了童年方格纸上的海战棋
前端·vue.js
CCIE-Yasuo1 小时前
网络安全-学习web开发-基础概念、常用标签
前端·学习
凉介川1 小时前
给 DeepSeek Harness 写插件:按扩展名接管 Windows 右键打开
前端