插件简介

该插件是作为 element-ui 树穿梭框的补全。拥有基本树形穿梭框的功能，此外样式充分还原 element 的原生样式，更好的跟 element 项目契合。 （此插件是基于 vue3 和 element-plus, 使用前请确保正确的运行环境）

安装方法

• npm i el-tree-transfer-plus

范例展示

<template>
  <div id="app">
    <TransferTree
      ref="transferTree"
      :data-source="dataSource"
      @getData="getData"
    />
  </div>
</template>

<script>
  import TransferTree from "el-tree-transfer-plus";
  const dataSource = ref([
    {
      id: "1",
      name: "京海强盛集团",
      pid: 0,
      children: [
        {
          id: "1-1",
          name: "项目管理部",
          pid: "1",
          children: [
            {
              id: "1-1-1",
              name: "唐小龙",
              pid: "1-1",
              children: [],
            },
            {
              id: "1-1-2",
              name: "唐小虎",
              pid: "1-1",
              children: [],
            },
          ],
        },
        {
          id: "1-2",
          name: "财务部",
          pid: "1",
          children: [
            {
              id: "1-2-1",
              name: "黄瑶",
              pid: "1-2",
              children: [],
            },
          ],
        },
      ],
    },
  ]);

  const getData = (data: any): void => {
    console.log("selectData", data.selectData);
  };
</script>