2021-05-08 el-table selection联动列表

如图效果：

微信图片_20210508154931.png

      
// 左边table
        
选择班级
        
          
          
        
        
          
          
          
        
      
      
// 右边已选学生
        
已选学生
        

          

            {{item.studentName}}
            
          
        
      
    

// 左边列表操作：checkbox点击触发改变事件
selectionChange(selection) {
      this.listSelection = []
      for (let item of selection) {
        let isExist = false
        for (let element of this.listSelection) {
          if (item.studentName === element.studentName && item.className === element.className) {
            isExist = true
            break
          }
        }
        if (!isExist) {
          this.listSelection.push(item)
        }
      }
    },
    // 右边列表操作：删除已选学生
    removeSelection(index) {
      let i = this.listStudent.findIndex(item=>item.id==this.listSelection[index].id)
      this.$refs.studentTable.toggleRowSelection(this.listStudent[i],false)
      // 会自动调用selectionChange这个函数，在函数里面会对集合进行清空重新加入操作
    }