vue2.0 组织机构树形选择组件(类似elementui <el-transfer> 与 <el-tree> 两个标签的结合)...

1. 效果图

 

2. 实现:   三级（部门或人员的树形选择）

3. 模拟数据说明：  fake.js

　　

　　name:  显示的名称(同时也是源码中 for 循环单一的key ，  如果真实数据存在名字有重复的情况， 建议加入ID字段作为主键)

　　type：  department 为部门   human 为个人

　　children： 数据类型必须为 数组，   type 为 human 个人时， 值为空数组 [],  为department 部门时   值为对象 或者为空数组

　　以上4个键为必须， 最多三级嵌套

4. 源码 https://github.com/IceGogh/vue-components

 

5. 直接引入时， 将父组件的真实数据 通过props方式 传入  organization组件

　　

　　5.1.文件位置:

　　components/OrganizationTree

 

　　5.2. 引入

　　import Organ from "@/components/OrganizationTree"

 

　　5.3.调用

　　<organization-tree dataList:"dataArray"></organization-tree>

 

转载于:https://www.cnblogs.com/qq4535292/p/8448091.html