el-tree 懒加载+局部刷新

场景：懒加载的树组件在执行增删改操作后需要执行局部刷新

element提供的树组件可以通过自定义树节点的内容给节点添加操作按钮，例如：新增下级、重命名、删除等

执行上述操作后，则需要针对性的刷新节点。以上面三个操作为例：

1. 新增下级：刷新当前节点的子集，且不改变当前选中项

2. 重命名：刷新当前节点所隶属的父节点的子集（即包含当前节点的最新数据），不改变当前选中项

3. 删除：刷新当前节点的父节点的子集，更改选中项为其父节点

官网提供的方法：

懒加载：

设置选中项：

树节点(node)上提供的方法：

代码：

 /* 懒加载 */
async loadNode(node, resolve) {
  if (node.level === 0) {
    // 异步加载根节点数据
    const data = await fn({ parentId: '' });
    resolve(data);
    this.$nextTick(() => {
      const nodeData = node.childNodes[0];
      // 设置选中项
      this.$refs.treeRef.setCurrentKey(data[0].id);
      // 默认展开最外层节点
      nodeData.expanded = true;
      // 自动加载二级节点的数据
      nodeData.loadData();
    });
  } else if (node.level > 0) {
    // 异步加载子节点数据
    const data = await fn({ parentId: node.data.id });
    resolve(data);
  }
},

 /* 刷新当前节点 */
refreshTreeNode(node) {
  // 更改当前节点的加载状态
  node.loaded = false;
  // 重新加载数据，入参为加载数据完成后执行的回调函数
  node.loadData(()=>{
    // 设置选中节点（缺少此步骤则会丢失选中状态）
    this.$refs.treeRef.setCurrentKey(node?.data?.id || 0);
  });
},

/* 刷新父节点 */
refreshParentTreeNode(node, isChangeSelect) {
  // 更改父节点的加载状态
  node.parent.loaded = false;
  // 重新加载数据
  node.parent.loadData(() => {
    if(!isChangeSelect) {// 不改变选中项
      this.$refs.treeRef.setCurrentKey(node?.data?.id || 0);
    } else {// 选中父节点
     this.currentNode = node.parent;
     this.$refs.treeRef.setCurrentKey(node.parent?.data?.id || 0);
     // todo 更改树节点选中项执行的数据操作
     // ...
    }
  });
},