[Vue] el-table多选框中回显问题

最新推荐文章于 2025-04-16 14:33:41 发布

绮崽.

最新推荐文章于 2025-04-16 14:33:41 发布

阅读量3k

点赞数 3

分类专栏： Vue 文章标签： vue.js javascript elementui

本文链接：https://blog.youkuaiyun.com/m0_63834711/article/details/126865182

版权

本文讲述了在Vue项目中使用ElementUI的el-table组件时遇到的多选框回显问题。通过查阅官方文档和网上资料，发现需要添加`el-table`的`:row-key`属性和`el-table-column`的`:reserve-selection`属性，并确保其为`true`。同时，数据需为数组对象形式，并使用`toggleRowSelection`方法结合正确的key（如key2）来实现回显。文中还提到了在不同场景下key的选择差异，以及使用forEach遍历时需要注意的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

https://element.eleme.cn/#/zh-CN/component/table elementui官网

这个问题昨天有遇到，也去element官网看了，它有的我也写上去了，为什么没有回显，就很奇怪哈--看图

toggleSelection() { //切换选中状态按钮
	if (this.$props.activeChange) {
		this.$props.activeChange.forEach(row => {
			this.$refs.multipleTable.toggleRowSelection([{id:0}, {id:1}]);
		});
	 } else {
		 this.$refs.multipleTable.clearSelection();
	}
}

this.$props.activeChange是传过来的数据，在这里回显的id我是写si的，却是上图一的样子..

后面是去上网查找了，网上说的也是云里雾里的，同样也没回显出来，但是它这个显了又没完全显的样子

网上是还需加属性-- 注意：el-table属性 :row-key="row => row.id"