一、问题描述
element ui的table组件设置成懒加载时,遇到数据表格需要更新、删除等操作,子节点不会自动更新。
二、解决思路
刷新数据,就是重新调用load(),通过map记录已展开的节点,需要刷新数据时,取出对应treeNode,调用load()进行数据刷新。
三、代码实现(VUE)
export default {data() {return {map: new Map(),}},methods: {load(tree, treeNode, resolve) {let parentId = tree.id;listCustomerPackageConsumeChildren(parentId).then((response) => {// 在节点展示加载数据时记录treeNode节点this.map.set(parentId, {tree,treeNode,resolve});resolve(response.data);});},// 在新增、编辑、删除子节点时,通过父级id找到对应的treeNode,重新加载子节点列表,完成数据刷新refresh(parentId) {if(this.map.get(parentId)) {const {tree,treeNode,resolve} = this.map.get(parentId);if(tree) {this.load(tree, treeNode, resolve);}}},updateTable(){//.....to do....// 刷新表格懒加载数据 this.refresh(你的id);}}}