element plus 组件 el-tree 设置 load 属性后重新加载数据的方法

在 Element Plus 的 el-tree 组件中，当你设置了 load 属性来实现树节点的懒加载时，你可以通过调用节点对应的 load 方法来手动重新加载数据。

以下是一个简单的例子，展示了如何在 Element Plus 中使用 el-tree 组件的 load 方法来手动重新加载数据：

<template>
  <el-tree
    :data="treeData"
    :props="defaultProps"
    :load="loadNode"
    lazy
  ></el-tree>
  <el-button @click="reloadData">重新加载数据</el-button>
</template>
 
<script setup>
import { ref } from 'vue';
 
const treeData = ref([]);
const defaultProps = {
  children: 'children',
  label: 'label'
};
 
const loadNode = (node, resolve) => {
  if (node.level === 0) {
    return resolve([{ label: '节点1' }]);
  }
  if (node.level > 0) {
    setTimeout(() => {
      const childNodes = [
        { label: `节点${node.data.label}-1` },
        { label: `节点${node.data.label}-2` }
      ];
      resolve(childNodes);
    }, 1000);
  }
};
 
const reloadData = () => {
  // 清空原有数据
  treeData.value = [];
  // 重新加载第一级节点
  loadNode({ level: 0 }, () => {});
};
</script>

在这个例子中，reloadData 函数通过清空 treeData 来重置树的数据，然后模拟调用原有的 load 方法来加载第一级节点。这样就能够实现重新加载数据的功能。注意，这里的 load 方法是模拟的，具体实现取决于你的数据获取方式。