今天遇到个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() //清除选中的数据
},

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

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐