关键点是设置一个存储树节点的仓库，且用new Map存储

1
2
3
4
5
6
7

data() {
  return {
    maps: new Map(),
  }
}

1
2
3
4
5
6
7
8
9

treeLoad(tree, treeNode, resolve) {
  const parentId = tree.id;
  this.maps.set(parentId, { tree, treeNode, resolve });
  getLazyList(parentId).then((res) => {
    resolve(res.data.data);
  });
},

在表格数据实时更新后引用maps的数据，动态更新子节点的内容

1
2
3
4
5
6
7
8
9
10
11
12
13

onLoad(page, params = {}) {
    this.loading = true;
    getLazyList(this.parentId, Object.assign(params, this.query)).then(
      (res) => {
        this.data = res.data.data;
        this.loading = false;
        this.selectionClear();
        this.updateTable();
      }
    );
  },

1
2
3
4
5
6
7
8

updateTable() {
  this.maps.forEach((item, key) => {
    const { tree, treeNode, resolve } = this.maps.get(key);
    this.treeLoad(tree, treeNode, resolve);
  });
},

如果是删除操作的话，这里需要加一段代码，先清空掉对应子节点的父节点下的数据

1
2
3

this.$set(this.$refs.crud.$refs.table.store.states.lazyTreeNodeMap, row.parentId, [])