iview table后端分页 跨页多选遇到的坑

问题：在iview的table组件中，前端在多选时如果点击下一页则丢失了上一页table的多选数据（由于采用的后端分页，每次翻页会直接刷新为新数据）

想要的效果：记住各个页选中的行数，并在界面上随翻页正常显示

大家看到这里，想必以为就直接记住row的id，然后在每次翻页加载时将以前选中的row勾选上就ok了是吧？
对的，思路就是这个思路。但问题是怎么勾选上？？？

我也是网上找了很多资料，后来才摸索出来。

1. 需要用到 this.$refs.table.toggleSelect(index)方法来勾选（我也是网上查的，再遍历了下table对象的方法，只有这方法看着能用的上，大佬有更好的方法的话求告知！） 更新：现在直接设置this.$refs.table.objData对象里的_isChecked就可以了，另外也没有重复触发on-select事件
2. 需要了解table的多选的事件触发顺序（看这个大佬iview table 中的checkbox 填坑）=>“所以可以推理iview的执行过程如下：触发选中事件时，先调用on-select, 再调用on-selection-change。”
3. 我采用的是on-select + on-select-cancel这两个事件来获取选中id，然后保存到指定set对象里
4. 更新：修复table全选问题

上代码

tabl组件：

<Table 
	ref="purchaseTable" :columns="table_columns" :data="table_data" 
	:loading="loading"   
	@on-select="handleSelectRow" @on-select-cancel="handleCancelRow"
	
	@on-select-all="handleSelectAll" @on-select-all-cancel="handleSelectAll">
Table>

函数：

	// data数据里的，我就懒得写全，大家知道就行了
	selectedIds: new Set(),//选中的合并项的id 
	selectedSum: 0, //选中的总数量
	
	// 注意，以下代码的id是我table数据里的id属性，只要是该行的唯一标识数据就行
	
	  // cy 全选和取消全选时触发
    handleSelectAll (selection) {
      // 取消全选 数组为空
      if (selection.length === 0) {
        // cy 若取消全选，删除保存在selectedIds里和当前table数据的id一致的数据，达到，当前页取消全选的效果
        // 当前页的table数据
        let data = this.$refs.purchaseTable.data
        data.forEach((item) => {
          if (this.selectedIds.has(item.id)) {
            this.selectedIds.delete(item.id)
          }
        })
      } else {
        selection.forEach(item => {
          this.selectedIds.add(item.id)
        })
      }
      //同步
      this.selectedSum = this.selectedIds.size
    },
    
    //  选中某一行
    handleSelectRow (selection,row) {
      this.selectedIds.add(row.id)
    },
    //  取消某一行
    handleCancelRow (selection,row) {
      this.selectedIds.delete(row.id)
    },
	
	//  这个函数就放在你点击翻页的函数里就行了（需要注意要在table将数据渲染完毕后执行，否则报错），
	//  达到每次翻页加载时将以前选中的row勾选上的效果
    // cy 给跨页丢失的选中行重新添加选中状态
    setChecked () {
      // 找到绑定的table的ref对应的dom，找到table的objData对象，objData保存的是当前页的数据
      let objData = this.$refs.purchaseTable.objData
      for (let index in objData) {
        // cy 设置审批状态为拒绝的采购单的默认勾选状态为 禁止
        if (objData[index].groupAuditStatus === '4') {
          objData[index]._isDisabled = true
        }
        if (this.selectedIds.has(objData[index].id)) {
          // cy 弊端 每次切换select都会触发table的on-select事件
          // this.$refs.purchaseTable.toggleSelect(index) // 在保存选中的ids的set合集里找与当前页数据id一样的行，使用toggleSelect（index），将这一行选中
          // cy 改进
          objData[index]._isChecked = true
        }
      }
    },

效果图：
emm总之我实现了table跨页多选，再加了个总选中个数的统计

最后：大家有更好的方法欢迎底下讨论
其他参考
怎样让iview的table表格，多选默认全选中