el-table翻页后保留勾选选项前言在这周的开发中，遇到了一个表格翻页后保留勾选选项的功能。在原来的组件中，是没有这个功能的，所以经过搜索分析，下面有一个例子，给大家分析一下。这个想法是找到信息并获得它。为了实现预留功能，需要存储勾选内容的数组（selectedItems）。通过el-table中的toggleRowSelection方法可以设置行的选中状态。通过el-table中的select和select-all获取勾选或取消的内容steptable勾选tableradio因为翻页后点击会出现undefined的选择，所以需要判断这里可以选择selection通过判断如果没有行，可以判断是增加还是删除select(selection,row){if(selection&&selection.find(item=>item&&(item.id==row.id))){this.addRows([row])}else{this.deleteRows([row])}}选择所有表用selection数组的长度来判断是选择还是取消selectAll(selection){if(selection.length>0){this.addRows(this.tableData(this.selectedItems.find(item=>item.id==row.id)){return}this.selectedItems.push(row)});},当selectedItems为空时数组，直接返回deleteRows(rows){if(this.selectedItems.length==0){return}rows.forEach(row=>{this.selectedItems=this.selectedItems.filter(item=>item.id==row.id)})}设置选择ed这里使用this.$nextTick是为了保证选中的效果在表格渲染完成后加入。selectedItem是过滤循环当前行是否在当前tableData数据中。rows.forEach(row=>{this.$nextTick(()=>{让selectedItem=this.tableData.find(item=>item.id==row.id)this.$refs.multipleTable.toggleRowSelection(selectedItem);});})完整代码
