<el-tree :props="props" :load="loadNode" lazy show-checkbox> </el-tree>懒加载加载中时禁止点击其他节点

在Element UI的树状组件`<el-tree>`中，`lazy`属性表示节点数据是通过异步加载的方式获取的。如果你想在加载过程中阻止用户点击其他节点，你可以利用组件提供的`node-key`属性和事件处理函数。

首先，在你的`props`对象中，设置`default-checked-keys`或`checked-keys`，用于存储当前选中的节点，这样可以记录用户的交互状态。然后，当`loadNode`函数正在执行时，可以通过检查`this.$store.state.tree.loading`或者其他类似的状态变量来判断是否应该禁用节点的点击行为。

例如：

<template>
  <el-tree
    :props="props"
    :load="loadNode"
    lazy
    @node-click.prevent="handleClick(node, isLoading)"
    :disabled="isLoading"
  >
    <!-- ... -->
  </el-tree>
</template>

<script>
export default {
  data() {
    return {
      props: { // 包含 node-key 属性
        nodeKey: 'id',
      },
      isLoading: false,
    };
  },
  methods: {
    loadNode(node) {
      this.isLoading = true; // 设置加载中标志
      // 异步加载节点数据
      setTimeout(() => {
        this.isLoading = false; // 加载完成后移除禁用状态
        // ...处理节点数据并更新状态
      }, 2000); // 模拟加载时间
    },
    handleClick(node, is_loading) {
      if (is_loading) {
        console.log('正在加载，请稍候...');
        return;
      }
      // 其他节点点击操作...
    },
  },
};
</script>

这样，在`loadNode`处理加载期间，所有节点都会被临时禁用，直到加载完成。如果用户尝试在此期间点击其他节点，会显示一个提示信息。