vue批量修改以及清除多选按钮失效

<r-table v-loading="dataListLoading" :data="dataList" ref="mainTable" :sup_this="sup_this"
					:total="total" :multiSelect="true" @row-click="getValId" grid-id="corAccBnkAccount"
					@selection-change="dataListSelectionChangeHandle">
</r-table>

• 其中:multiSelect="true"负责设置多选按钮
• @selection-change="dataListSelectionChangeHandle"代表每次选中多选按钮会执行的事件，下面是事件：

//每次选中或者取消复选框的时候，把选中行的id传给selectId数组
dataListSelectionChangeHandle(data){
	this.selectId = []
	for(let i=0;i<data.length;i++){
		if(data[i].id!=''){
			this.selectId.push(data[i].id)
		}
	}
},

明白以上操作后就可以根据需求进行批量修改删除，但如果还需要在修改完后取消所有选中，就要注意了，这里面有个坑！！！

很多博客会告诉你用clearSelection方法来取消选中，这是对的，但如果你按照那些博客说的进行下一步，用该方法

this.$refs.mainTable.clearSelection()

就会发现多选按钮并没有被取消选中，这是为什么？
让我们打开浏览器控制台将this.$refs.mainTable打印一下

console.log(this.$refs.mainTable)

会发现，在this.$refs.mainTable下没有clearSelection()方法（原因可能是因为标签是公司封装的标签，所以原本标签中方法的位置发生了改变）

它其实在这里

所以需要这样写

this.$refs.mainTable.$children[0].clearSelection()

注意：mainTable是table里面的ref=“mainTable”
至于为啥只有数组的第一个数据里面有clearSelection()方法，这个我就不知道了，没学过vue，这算是一边解决问题一边学习了。

补充知识点：

事件：
select：当用户手动勾选数据行的 Checkbox 时触发的事件，参数：selection, row
select-all：当用户手动勾选全选 Checkbox 时触发的事件，参数：selection
selection-change：当选择项发生变化时会触发该事件，参数：selection
方法：
clearSelection：多选表格，清空用户选择
toggleRowSelection：用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）	row, selected
toggleAllSelection：用于多选表格，切换所有行的选中状态