element-ui 中 el-table 分页多选（记住上一页勾选数据）及编辑回显

element-ui 中 el-table 分页多选（记住上一页勾选数据）及编辑回显

element-ui 的官网是有属性的

el-table-colum 的 reserve-selection 属性

el-table 的 row-key 属性

row-key 属性传入唯一值

<el-table
  :data="tableData"
  border
  stripe
  v-loading="tableloading"
  ref="multipleTable"
  row-key="equipmentId"
  @selection-change="handleSelectionChange"
>
  <el-table-column type="selection" label="序号" reserve-selection width="50"></el-table-column>
</el-table>

row-key 属性传入一个方法

<el-table
  :data="tableData"
  border
  stripe
  v-loading="tableloading"
  ref="multipleTable"
  :row-key="getRowKeys"
  @selection-change="handleSelectionChange"
>
  <el-table-column type="selection" label="序号" reserve-selection width="50"></el-table-column>
</el-table>

getRowKeys(row) {
  return row.equipmentId
},

编辑回显数据

核心：this.$refs.multipleTable.toggleRowSelection(val, true)

// 数据列表
dataTable() {
  let vm = this;
  let url = vm.common.data().wisdomCommunityWeb + "/upgrade/plan/equipment-page-list";
  let data = {};
  data = { ...vm.dataForm, ...vm.pages };
  vm.tableloading = true
  vm.common.getdata(vm, url, data, function (res) {
    vm.tableloading = false;
    vm.tableData = res.data;
    vm.pages.num = res.total;
    vm.tableData.forEach((item) => {
      if(item.isCheck == 2) {
        vm.$refs.multipleTable.toggleRowSelection(item)
      }
    });
  });
},