目录
一、前言
二、reserve-selection
三、清除某些选中项
四、细节
一、前言
第一阶段:一开始是定义了两个集合用来保存:data的数据, 集合数据动态切换变化的时候直接获取最新的, 但是缺点是不能保存勾选状态.第二阶段:发现只能操作原:data的数据, 所谓的checked再往回赋值根本没用. 缺点是数据操作和列表数据模糊查询不能实现.第三阶段:发现了reserve-selection这个东东, 近乎完美解决问题总结:遇到问题先别急着造轮子, 大概率有对应的功能标签了, 一般的业务根本触及不到vue的设计缺陷的...二、reserve-selection
<el-table ref="table" :row-key="rowKey" :data="tableData" @selection-change="selectionChange"max-height="666px"><el-table-column type="selection" label="全部" width="55" align="center" :reserve-selection="true" /><el-table-column label="姓名" align="left" prop="name" /><el-table-column label="手机号" align="left" prop="phone"/></el-table>
methods: { rowKey(row) {//row-key就是要指定一个key标识这一行的数据,保证唯一即可return row.id;},// 列表选择,val选中的表格行数据selectionChange(val) {console.log(val)},//清除表格所有的选中项clearSelect(){//方法1this.$refs["table"].clearSelection();//方法2this.$refs.buyerTable.clearSelection();},},三、清除某些选中项
for (let i = 0; i < this.selections.length; i++) {if (true) {this.$refs.table.toggleRowSelection(this.selections[i]);i--;}}四、细节
清除某行数据时, 集合的长度会实时变化, 如果按照原有索引去删除就会少删.所以, 正序删的时候, 每删除一个就要索引-1反序删直接删就行有用请点赞，养成良好习惯！
疑问、交流、鼓励请留言！
