el-tree-transfer
el-tree-fransfer是一个基于VUE和element-ui的树形穿梭框组件,使用前请确认已经引入element-ui! 此组件功能类似于element-ui的transfer组件,但是里面的数据是树形结构! 实际上,el-tree-transfer依赖的element-ui组件分别是Checkbox 多选框,Button 按钮,和最主要的Tree 树形控件写成!并非是在element-ui的穿梭框组件上的扩展,而仅仅是参照了其外观样式和功能。ui完全按照element-ui风格。
注意:使用此插件时默认你已经引入了element-ui的button,check-box,tree组件!
第一层数据的 pid 请设定为 0!!
id推荐为string,但也可以是number,请不要混用,id不能重复!
1.先npm下载插件
npm install el-tree-transfer --save
或
npm i el-tree-transfer -S
然后你可以像使用普通组件一样使用el-tree-transfer
// 你的代码
...
// 使用树形穿梭框组件
import treeTransfer from 'el-tree-transfer' // 引入
export defult {
data(){
return:{
mode: "transfer", // transfer addressList
fromData:[
{
id: "1",
pid: 0,
label: "一级 1",
children: [
{
id: "1-1",
pid: "1",
label: "二级 1-1",
children: []
},
{
id: "1-2",
pid: "1",
label: "二级 1-2",
<