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>
相关推荐
计算机-秋大田23 分钟前
基于Spring Boot的城市垃圾分类管理系统设计与实现(LW+源码+讲解)
java·vue.js·spring boot·后端·spring·课程设计
时无诳语Imp30 分钟前
VUE + pdfh5 实现pdf 预览,主要用来uniappH5实现嵌套预览PDF
vue.js·pdf·uni-app
一只小白菜~1 小时前
记录一下vue2项目优化,虚拟列表vue-virtual-scroll-list处理10万条数据
javascript·vue.js·虚拟列表
dy17171 小时前
el-table单独某列自适应文字换行
javascript·vue.js·elementui
wwf12251 小时前
el-table 多级表头
javascript·vue.js·elementui
沙漏无语1 小时前
node-sass@4.14.1报错的最终解决方案分享
前端·css·sass
Colesyn L.1 小时前
vue3+element-plus暗黑模式切换动画圆弧过渡
前端·javascript·vue.js
草木红1 小时前
三、Angular 路由
前端·javascript·angular.js
Never_every992 小时前
PPT素材免费下载
大数据·前端·powerpoint·ppt
一棵开花的树,枝芽无限靠近你2 小时前
【PPTist】公式编辑、插入音视频、添加动画
前端·笔记·学习·编辑器·ppt·pptist