element+vue表格分页多选

最新推荐文章于 2024-05-16 02:24:58 发布

yaoqiuquan

最新推荐文章于 2024-05-16 02:24:58 发布

阅读量842

点赞数

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

本文链接：https://blog.csdn.net/yaoqiuquan/article/details/123332387

版权

vue 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

1、使用row-key和reserve-selection结合就能实现分页多选回显

<el-table 
	ref="table"
	:data="tableData"
	:header-cell-style="{'text-align': 'center'}"
	:cell-style="{ 'text-align': 'center' }"
	@selection-change="handleSelectionChange"
	:row-key="getRowKeys">
	<el-table-column type="selection" width="55" :reserve-selection="true">
	</el-table-column>
</el-table>
data() {
  return {
    // 获取row的key值
    getRowKeys(row) {
      return row.id;
    },
    selectedData: [],//多选的数据
  };
},
methods:{
	handleSelectionChange(rows){
	  this.selectedData = [];
	  if (rows) {
	    this.selectedData = rows.map(row => { return row.id })
	  }
	}
}