Avue树结构懒加载子节点不刷新

节点不刷新"/>

Avue树结构懒加载子节点不刷新

我们在使用Avue组件的时候，会用到树这种结构，但是树的懒加载子节点不刷新问题官方并没有告诉我们怎么做，下面是解决办法。

树结构懒加载子节点不刷新

data

首先在data创建一个map
data(){maps: new Map()
}

子节点

    treeLoad(tree, treeNode, resolve) {const parentId = tree.id;//将当前节点存到maps里面this.maps.set(parentId, {tree , treeNode, resolve})getLazyList(parentId).then(res => {resolve(res.data.data);});},  

保存方法

rowSave(row,done,loading) {add(row).then(() => {// 获取新增数据的相关字段this.$message({type:'success',message:'操作成功'});//数据回调进行刷新done(row);//在表格数据实时更新后引用maps的数据，动态更新子节点的内容this.maps.forEach((item, key) => {const {tree, treeNode, resolve} = this.maps.get(key)this.treeLoad(tree, treeNode, resolve)})},error => {window.console.log(error);loading();});},

表格的树形结构懒加载

{label:'籍贯',prop: 'nativePlace',type:'tree',dicData: [],dicUrl:'/api/blade-system/region/lazy-tree?parentCode={{key}}',props:{label:"title",value: "id"}, lazy:true,change: ({ value }) => {// 联动下一级this.getRegionLazyTree(value);//   调取父及数据接口，避免再次点击没有数据this.getRegionLazyTree("00")},treeLoad: (node, resolve)=> {const parentCode = (node.level === 0 ) ? "00" : node.data.id;getRegionLazyTree(parentCode).then(res => {resolve(res.data.data.map(item => {return {...item,leaf: !item.hasChildren}}))});}},