分页勾选数据，进行批量操作

首先放张图，描述一下问题：当前页有20条数据，我要勾选第一页和第二页的数据进行批量删除，进行翻页时容易丢失选择的数据

根据iview的table属性，我在table中加入了如下操作

四条属性可以看看iview的解释

以下代码为操作具体步骤，有问题的欢迎评论，我会补充的，感谢！

// data中定义了一些属性：
data() {
     return {
        arr: [],
        selectedSum: 0,
        selectedIds: new Set(),  // es6数组去重
    }
}

// 这是我的查询方法，在每次查询时会调用setChecked()方法
queryRecord(page) {
     apiRequest(this, querySysTest(page,this.searchInfo), response => {
          this.page = response.data.page
          this.data = response.data.data
          this.$nextTick(() =>{
               this.setChecked()
          })
          this.loading = false
          this.arr = []
     });
},
setChecked() {
     // objData保存当页的数据
     let objData = this.$refs.table.objData
     for(let i in objData) {
         if(this.selectedIds.has(objData[i].id)) {
         console.log(objData[i])
             objData[i]._isChecked = true
          }
     }
},
// 单选一行:把这行的id放入数组内，并且根据数组的长度来计数
handleSelectRow(selection,row) {
     this.selectedIds.add(row.id)
     this.selectedSum = this.selectedIds.size
},
// 单选取消一行：把这行的id移出数组内，并且根据数组的长度来计数
handleCancelRow(selection,row) {
     this.selectedIds.delete(row.id)
     this.selectedSum = this.selectedIds.size
},
// 全选和取消全选方法
handleSelectAll(selection) {
     // 因为全选和取消全选都用的一个方法，所以以选择的selection的长度来判断是全选还是取消
     // =0 说明是取消，取消则delete数组中保存的id，否则往数组增加id
     if(selection.length === 0) {
     // 当前页的table数据
     let data = this.$refs.table.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
},
// 批量删除方法：删除完刷新页面，计数为0
deleteAll() {
      this.arr = Array.from(this.selectedIds)
      if(this.arr.length <= 0) {
            this.$Message.warning("请选择需要删除的信息！");
      } else {
            this.$Modal.confirm({
            title: '批量删除确认提示',
            content: '您确认要批量删除选中的信息吗？',
            okText: '删除', cancelText: '取消',
            onOk: () => {
                 apiRequest(this, deleteAll(this.arr), response => {
                      this.$Message.success(response.msg);
                      this.$Modal.remove();
                      this.selectedSum = 0   
                      this.queryRecord({page:1, pageSize:this.page.pageSize})
                 });
            }
       });
}