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>
相关推荐
ZC跨境爬虫7 分钟前
跟着 MDN 学JavaScript day_5:技能测试——变量实战
java·开发语言·前端·javascript
HjhIron13 分钟前
深入理解 JavaScript 执行机制:从编译到运行的完整揭秘
javascript
pan_junbiao19 分钟前
Whistle 抓包工具的安装与使用
前端·测试工具·压力测试·抓包
Cory.眼26 分钟前
前端调用后端接口全流程实战
前端·调用接口
云水一下27 分钟前
TypeScript 从零基础到精通(四):面向对象编程(类与继承)
javascript·typescript
牛栓柱32 分钟前
【后端实战】用 Supabase + React/TS 零成本构建高并发 Multi-Agent 服务
前端·数据库·人工智能·后端·react.js·前端框架
木斯佳35 分钟前
前端八股文面经大全:百度-Agent部门-前端一面(2026-06-04)·面经深度解析
前端
shmily麻瓜小菜鸡35 分钟前
Bootstrap 4 常用工具类速查表
前端·javascript·bootstrap
CDN36037 分钟前
【架构进阶】告别配置漂移!用 NodeNext + Workspace 打造优雅的 TypeScript Monorepo
前端·javascript·typescript
协享科技43 分钟前
前端 SSE 流式响应处理实践:从接收、解析到渲染
前端·人工智能·程序人生·go·ai编程·sse