2.0.7 • Published 7 months ago
github
https://github.com/walkalonelxy/ele-tree-select
说明
- 此插件是基于elementUI开发的下拉树组件
- 目前不支持单选,暂只支持多选
安装
npm i ele-tree-select -S
使用
在 main.js 中引入
import EleTreeSelect from 'ele-tree-select'
import 'ele-tree-select/lib/ele-tree-select.css'
Vue.use(EleTreeSelect)
属性
属性 | 说明 | 类型 | 是否必传 | 默认值 | 可选值 |
---|
props | 配置选项 | object | 否 | 见下面配置选项 | -- |
code | 作为组件的唯一标志返回 | string | 否 | -- | -- |
treeData | 作为组件的数据传入,如果开启懒加载,需要将异步获取的数据组装成树型数据传入 | array | 是 | -- | -- |
clearable | 是否可清空选项 | boolean | 否 | true | false |
accordion | 是否每次只打开一个同级树节点展开 | boolean | 否 | false | true |
multipleChoice | 是否多选,暂时只支持多选 | boolean | 否 | true | true |
lazy | 是否使用懒加载 | boolean | 否 | false | true |
checkStrictly | 多选时是否父子节点不互相关联 | boolean | 否 | true | false |
filterable | 是否可搜索 | boolean | 否 | false | true |
placeholder | 设置搜索框的placeholder | string | 否 | 查找关键字 | -- |
props配置选项(同elementUI的tree组件的配置选项)
参数 | 说明 | 类型 | 默认值 |
---|
value | -- | string | id |
label | -- | string | title |
children | -- | string | children |
isLeaf | -- | string | leaf |
事件
事件名称 | 说明 | 回调参数 |
---|
lazyLoad | 懒加载时触发的事件 | node:点击的节点对象,resolve:在异步请求结束后需要resolve请求的结果,code:对应上面的code属性 |
getCheckedData | 获取选中项的value | value:选中节点的value,code:对应上面的code属性 |
getCheckedItem | 获取选中节点的对象 | data:选中节点的对象,code:对应上面的code属性 |
方法
方法名称 | 说明 | 参数 |
---|
clear | 清空所有选中的数据 | -- |
removeTag | 移除指定的选中项 | value:props里面value映射的字段 |