vue-treeselect事件

### Vue-Treeselect 组件事件使用方法

Vue-Treeselect 是一个功能强大的树形下拉选择器组件，支持多种交互方式和自定义选项。为了更好地理解其事件机制，下面通过具体示例说明如何监听并处理 `@expand-node` 事件。

#### 示例代码

当节点展开时触发加载子节点的方法：

<template>
  <div>
    <!-- treeselect 组件绑定 expand-node 事件 -->
    <treeselect 
      @expand-node="loadChildren"
      :options="treeSelectOptions" 
      v-model="selectedValue">
    </treeselect>
  </div>
</template>

<script>
import Treeselect from '@riophae/vue-treeselect';

export default {
  components: { Treeselect },
  data() {
    return {
      treeSelectOptions: [],
      selectedValue: null,
    };
  },
  methods: {
    loadChildren(node) {
      console.log('Node expanded:', node);
      // 这里可以实现异步请求获取子节点数据逻辑
      setTimeout(() => {
        const newChild = {
          id: Date.now(),
          label: 'New Child',
          children: []
        };
        if (!node.children) {
          this.$set(node, 'children', []);
        }
        node.children.push(newChild);
      }, 1000); // 模拟网络延迟
    }
  }
};
</script>

此段代码展示了如何在 `<treeselect>` 标签内设置 `@expand-node` 属性来关联到 `loadChildren` 方法，在该方法内部可以根据实际需求执行相应的业务逻辑[^1]。

对于其他类型的事件，如点击某个特定节点(`@select`) 或取消选中 (`@deselect`) ，也可以采用相似的方式进行绑定和响应函数编写。需要注意的是，不同版本之间可能存在 API 变更的情况，请参照官方文档确认最新用法[^2]。