Tree 树形控件

基础用法

基础的树形结构展示。

连接线

为 Tree 添加 showLine 属性即可使树具有连接线

可选择

通过 checkable 属性控制复选框开关，默认 false

复选框位置

通过 checkable 属性控制复选框开关，默认 false

自定义图标以及 label

自定义展开图标，设置icon插槽

操作节点

通过设置 operable 打开节点操作按钮。

节点懒加载

通过设置该节点 isLeaf 参数为 false, 组件回调 lazyLoad 方法实现节点懒加载。

可拖拽树

通过draggable属性配置节点的拖拽功能。

右键菜单

手风琴模式

accordion对于同一级的节点，每次只能展开一个

API

树形控件 Props

参数	说明	类型	默认值	备注
data	数据	Array	[]
emptyText	内容为空的时候展示的内容	String	—
field	配置选项，具体卡下表	Object	—
showLine	是否显示连接线	Boolean	false
checkable	是否显示选择框	Boolean	false
checkbox-placement	复选框位置	left | right	left
block-line	节点整行撑开	Boolean	false
block-node	节点名称整行撑开	Boolean	false
default-expand-all	是否默认展开所有节点	Boolean	false
cascade	是否关联选项	Boolean	false	考虑中（要不要和复选框的点击分开）
pattern	默认搜索的内容	string	''	开发中
default-expanded-keys	默认展开的节点的 key 的数组	Array<string|number>	—	开发中
accordion	是否每次只打开一个同级树节点展开	Boolean	false	开发中
expand-on-click	是否在点击节点后展开或收缩节点	Boolean	false	开发中
rightMenu	右键菜单	Boolean	false	开发中

field

Props	说明	类型	默认值
label	指定节点标签为节点对象的某个属性值	string | (data, node) => string	—
children	指定子树为节点对象的某个属性值	string	—
disabled	指定节点选择框是否禁用为节点对象的某个属性值	string | (data, node) => string	—
isLeaf	指定节点是否为叶子节点，仅在指定了 lazy 属性的情况下生效	string | (data, node) => string	—
class	自定义节点类名	string | (data, node) => string	—

树形控件 Events

事件名	说明	回调参数

树形控件 Slots

名称	说明
empty	内容为空的时候展示的内容