Vue+Element Ui Table取消勾选的问题

今天遇到个bug，就是当我对表格里面的数据进行勾选之后，然后再进行一些操作（比如：筛选、查询等）以前勾选的数据还是在勾选状态，如果不注意，再去勾选一些数据，然后操作一些其他的操作（比如删除、上下架等）就会多传给后端数据，经过测试，发现会带入以前勾选的数据，造成的原因就是，没有将以前勾选的数据，经过一系列的操作之后清空。那么怎么清空数据？可能你想到的一个方法就是刷新表格，但是刷新表格不起作用，其次就是想到清空得到的勾选数据，但是也不起作用，最后经过对element ui table的研究发现了，clearSelection：用于多选表格，清空用户的选择。

1、在表格上操作dom元素 设置ref属性

<el-table 
          ref="multipleTable" //添加的代码
          :data="tableData.body" 
          :row-key="getRowKeys" border
          max-height="700" 
          style="width: 100%"
          @selection-change="selectionChange">
</el-table>

2.当你操作某个操作时（比如：筛选、查询）

searchTableData(){
   this.$refs.multipleTable.clearSelection() //清除选中的数据
},

这个时候，当你勾选了一些数据之后，然后又去筛选其他的数据时，以前勾选的数据就会清空。