Element Table uses toggleRowSelection to add the default value does not take effect and the solution

The demand I encountered, the data in the multi-selection list is echoed to the table on the page, and the table on the page can delete the data.

点击图片一中的选择按钮弹出图片2的弹框

图片2中选中的数据回显到图片一的表格

每次切换页码或者打开弹窗都需要匹配上已选中的数据，所以就需要用到
this.$refs[ref bound to your form].toggleRowSelection()

this.$refs[ref bound to your form].clearSelection()

My code below is to loop through the selected list every time the interface is requested, and add the selected form to the form in the pop-up box (Picture 2) through the toggleRowSelection method

apis
  .merListApi(params)
  .then(res => {
    
    
    this.isLoading = false;
    this.merList = res.data.list;
    this.pagination = res.data.pagination;
    this.$nextTick(() => {
    
    
      this.$refs.multipleTable.clearSelection();
      this.form.merchant_list.forEach(val => {
    
     // this.form.merchant_list 是我已选中的数据列表
        this.$refs.multipleTable.toggleRowSelection(val, true);
      })
    })
  })
  .catch(() => {
    
    
    this.isLoading = false;
  });

Unfortunately, it doesn't work. After careful comparison, I feel that there is no difference between my code and official documents. I wonder if the version level of my element is too low? I immediately yarn add the latest dependency of element, but it still doesn't work.

I have doubts whether the code in the official document is easy to use? I just copied his code and tried it, it worked, and then I compared it carefully, and found that there was only one difference:我是两个表格的数据，而官方toggleRowSelection操作的同一个表格的数据，我们之间的差别就是数组之间的指针，然后我根据这一点修改代码

apis
  .merListApi(params)
  .then(res => {
    
    
    this.isLoading = false;
    this.merList = res.data.list;
    this.pagination = res.data.pagination;
    this.$nextTick(() => {
    
    
      try {
    
    
        this.$refs.multipleTable.clearSelection();
        this.form.merchant_list.forEach(val => {
    
    
          this.$refs.multipleTable.toggleRowSelection(
            this.merList.find( // 这是我弹框表格的数据
              item => val.merchant_id === item.merchant_id
            ),
            true
          )
        })
      } catch (error) {
    
    }
    })
  })
  .catch(() => {
    
    
    this.isLoading = false;
  })

Through the find method, let the list (this.merList) in the bullet box match the data of the selected list (this.form.merchant_list), and then use toggleRowSelection. This time it finally succeeded.总结：toggleRowSelection操作的数据和指针有关，我们只能操作当前列表的list，就像之前我的错误操作，虽然toggleRowSelection传入的row（val）和选中列表中的某一项数据一模一样，但是我传入的row和弹框列表某一项的row指向不同的地址