elementUI多选框反选的实现代码

最近有一个需求，点击添加按钮，弹出窗口（窗口显示多选、可翻页、可检索列表），选中多条信息，当我点击确定按钮，把选中信息显示在页面上；点击取消，选中信息不显示在页面上。再次打开，把在页面上的信息显示选中状态。

思路：一开始选用elementUI官网例子,使用selection-change，但是它只显示当前改变的选择，不能满足我翻页及检索后还能选中数据的问题

toggleSelection(rows) {    if (rows) {     rows.forEach(row => {      this.$refs.multipleTable.toggleRowSelection(row);     });    } else {     this.$refs.multipleTable.clearSelection();    }   }

后来查询api，发现了另外2个api，页面上的存在本地字段 glht，列表上选中的存在本地字段 yglht.

每次要计算页面显示的数据是列表的第几条数据，直接把对象放里面并不会勾选我上传选中的数据。

emmm....知道有点蠢，但是我还没想到别的办法...

弹框：

<el-dialog class="contract_modal" title="信息" :visible.sync="glht_modal" width="80%" :modal="false" @close="cancel"> <el-form :inline="true" :model="searchData" label-width="90px">  <el-form-item label="名称：">   <el-input v-model.trim="searchData.mc_" size="small" class="contract_input"></el-input>  </el-form-item>  <span class="list_btns">   <el-button type="primary" size="small" @click="listSearch(page, 1)" class="con_btn">搜索</el-button>   <el-button size="small" @click="searchData = {}" class="con_btn">清空</el-button>  </span> </el-form> <div id="list_body" class="list-body" style="padding-left: 0;">  <el-table :data="tableData" stripe border style="width: 100%" max-height="480" ref="multipleTable" @select-all="handleSelectionAll" @select="handleSelectionChange">   <el-table-column type="selection" width="26" align="right"></el-table-column>   <el-table-column type="index" width="50" label="序号" align="left" header-align="left"></el-table-column>   <el-table-column prop="mc_" label="名称" width="180" show-overflow-tooltip align="left"></el-table-column>     </el-table>  <div class="list-pagination">   <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"           :current-page.sync="page.page" :page-sizes="[10, 20, 50, 100]":page-size="page.pageCount"           layout="total, sizes, prev, pager, next, jumper, ->"           :total="page.total"></el-pagination>  </div> </div> <div slot="footer" class="dialog-footer">  <el-button type="primary" @click="save" size="small">确定</el-button>  <el-button @click="cancel" size="small">取消</el-button> </div></el-dialog>

methods 里，全选时与选中单个时所做的操作：