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>
相关推荐
严肃小白兔7 小时前
TanStack Router 更新构建工具链:Node.js 兼容性、路由分割与前端工程实践
前端·node.js·状态模式
IT_陈寒8 小时前
Vue这个奇葩的响应式问题让我加班到凌晨
前端·人工智能·后端
风骏时光牛马8 小时前
功能可用性自动化测试验证
前端
LucianaiB18 小时前
【元宝搜索开发者征文大赛】AI时代,学得慢就不用学?用元宝搜索打造一个教程保质期,确保每一个教程符合你的现状
前端·人工智能·ai编程
excel18 小时前
JavaScript 对象池:减少高频对象创建与 GC 压力
前端
陈随易20 小时前
纯 Go 写的 JS 引擎,跑分超过了 C 语言的 QuickJS
前端·后端·程序员
子兮曰21 小时前
Chrome 权限元素实战:144 与 151 的渐进增强写法
前端·javascript·chrome
IT_陈寒21 小时前
Redis连接池泄漏那次,我差点把生产环境搞崩了
前端·人工智能·后端
强尼银手1 天前
我花一天做了个格斗游戏原型,判定全对,然后被「美术」劝退了
前端·javascript
石小石Orz1 天前
AI 正在蚕食我们的编码能力
前端·后端·算法