vue treeselect穿梭框使用

Vue Treetable Select是一个基于Vue.js的树形选择组件，它可以创建类似于Excel数据穿梭的功能，让用户可以选择或拖拽节点，适用于需要处理层级结构数据的选择场景。在使用时，你需要做以下几个步骤：

1. **安装**：首先通过npm或yarn安装`vue-treetable-select`插件到你的项目中。

npm install vue-treetable-select --save
# 或者
yarn add vue-treetable-select

2. **引入并注册组件**：在你的Vue组件里引入并注册`TreeTableSelect`组件。

import { TreeTableSelect } from 'vue-treetable-select';

export default {
  components: {
    TreeTableSelect,
  },
};

3. **配置数据源**：提供一个包含id、label、children属性的数据数组，通常以树状结构表示。

4. **设置选项**：初始化`TreeTableSelect`时，可以设置选项如搜索功能、允许拖放等。

<template>
  <div>
    <TreeTableSelect :data="treeData" @on-selected-change="selectedChange"></TreeTableSelect>
  </div>
</template>

<script>
export default {
  data() {
    return {
      treeData: [
        // ...你的树状数据
      ],
    };
  },
  methods: {
    selectedChange(selectedItems) {
      console.log('选择了:', selectedItems);
    },
  },
};
</script>

5. **事件监听**：通过`@on-selected-change`事件监听用户的选择变化，并处理用户的操作。

注意，详细的文档和示例可以在官方GitHub仓库中找到，以便进一步定制化需求。