element的el-table组件实现分页复选功能及解决批量删除后仍会选中已删除的值问题

一、element的el-table组件实现分页复选功能

1.在标签中加入:row-key=“getRowKeys”

<el-table :data="list" :row-key="getRowKeys" style="width: 100%" @selection-change="handleSelectionChange">

2.在显示复选框一栏中添加:reserve-selection=“true”,只对type="selection"有效,作用在数据更新之后保留之前选中的数据（需指定 row-key）

<el-table-column :reserve-selection="true" type="selection" width="45"/>

3.其他方法代码

// 行数据的 Key
getRowKeys(row) {
 return row.id
},
 // 复选框选中赋值操作
handleSelectionChange(rows) {
   this.selectIds = []
   if (rows) {
     rows.forEach((row) => {
       if (row) {
         this.selectIds.push(row.id)
       }
     })
   }
 },

二.解决el-table复选框 批量删除后仍会选中已删除的值

// 使用clearSelection,清空用户之前的选择

 this.$refs.table.clearSelection()