小编给大家分享一下element如何实现table跨分页多选及回显，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！

1.data中定义getRowKeys，记录每行的key值

getRowKeys(row){returnrow.id;},

2.el-table绑定getRowKeys

<el-table:data="tableData"@selection-change="handleSelectionChange":row-key="getRowKeys">

3.将selection列的reserve-selection设为true

<el-table-columntype="selection"width="50"align="center":reserve-selection="true"></el-table-column>

4.表格数据选中方法handleSelectionChange

handleSelectionChange(rows){this.multipleSelection=rows;this.select_number=this.multipleSelection.length;this.select_Id=[];if(rows){rows.forEach((row)=>{if(row){this.select_Id.push(row.id);}});}},

代码整理

<template><div><el-table@selection-change="handleSelectionChange":row-key="getRowKeys"><el-table-columntype="selection"width="50"align="center":reserve-selection="true"></el-table-column></el-table><el-pagination>...</el-pagination></div></template><script>exportdefault{data(){return{multipleSelection:[],//表格选中getRowKeys(row){//记录每行的key值returnrow.id;},select_number:"",//表格select选中的条数select_Id:[],//表格select复选框选中的id}},methods:{handleSelectionChange(rows){this.multipleSelection=rows;this.select_number=this.multipleSelection.length;this.select_Id=[];if(rows){rows.forEach((row)=>{if(row){this.select_Id.push(row.id);}});}},}}

看完了这篇文章，相信你对“element如何实现table跨分页多选及回显”有了一定的了解，如果想了解更多相关知识，欢迎关注亿速云行业资讯频道，感谢各位的阅读！