业务需求:
点击查询弹列表框
勾选列表选项保存
可删除可重新查询列表添加
遇到的问题:删除之后查询列表selection回显问题
解决:@row-click配合:reserve-selection="true"使用
<el-tableref="refPlanTable":data="refPlanTableData"tooltip-effect="dark":max-height="400":height="400":header-cell-style="{textAlign: 'center'}":cell-style="{textAlign:'center'}"@selection-change="handleSelectionChangeRef"@row-click="handleRowClickRef":row-key="getRowKey"><el-table-column type="selection" width="55" fixed="left" :reserve-selection="true"></el-table-column></el-table>
handleRowClickRef(row){ this.$refs.refPlanTable.toggleRowSelection(row); },
表格data赋值的地方添加
注意::reserve-selection="true"会记录保存上一次选中的状态,所以每次赋值前要先清空选中状态
this.refPlanTableData=res.result;let string = this.multipleSelectionRef.map(item => item.identity);console.log(string);this.$nextTick(() => {this.refPlanTableData.forEach(item=>{this.$refs.refPlanTable&&this.$refs.refPlanTable.toggleRowSelection(item,false);if(string.includes(item.identity)){this.$refs.refPlanTable&&this.$refs.refPlanTable.toggleRowSelection(item,true);}})})