vue实现elementUI table表格树形结构-使用懒加载时-解决子节点增删改后，不刷新子节点数据问题

在Vue中使用Element UI的Table组件实现树形结构时，如果使用懒加载功能，并且需要在子节点增删改后不刷新整个子节点树，可以通过以下步骤来实现：

1. 为每个节点维护一个独立的状态，包括节点的数据和是否为展开状态。
2. 使用lazy属性启用懒加载功能。
3. 在子节点增删改操作后，只需更新对应的节点数据，而不刷新整个子节点树。

以下是一个简化的示例代码：

<template>
  <el-table
    :data="treeData"
    :row-key="getRowKey"
    :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
    lazy
    @expand-change="loadChildren"
  >
    <!-- 你的表格列 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      treeData: []
    };
  },
  methods: {
    getRowKey(row) {
      return row.id;
    },
    loadChildren(row, treeNode, resolve) {
      // 仅在第一次展开时加载子节点
      if (row.children && row.children.length === 0) {
        this.fetchChildren(row.id).then(childrenData => {
          row.children = childrenData;
          resolve(childrenData);
        });
      }
    },
    fetchChildren(parentId) {
      // 模拟从服务器获取数据
      return new Promise((resolve) => {
        setTimeout(() => {
          resolve([
            // 子节点数据
          ]);
        }, 1000);
      });
    },
    addNode(parentId, newNode) {
      const parent = this.treeData.find(node => node.id === parentId);
      if (parent) {
        parent.children = parent.children || [];
        parent.children.push(newNode);
      }
    },
    updateNode(nodeId, updatedData) {
      const node = this.findNodeById(nodeId);
      if (node) {
        Object.assign(node, updatedData);
      }
    },
    deleteNode(parentId, nodeId) {
      const parent = this.treeData.find(node => node.id === parentId);
      if (parent && parent.children) {
        parent.children = parent.children.filter(node => node.id !== nodeId);
      }
    },
    findNodeById(id) {
      let foundNode = null;
      const search = (nodes) => {
        nodes.forEach(node => {
          if (node.id === id) {
            foundNode = node;
            return;
          }
          if (node.chi