TreeSelect 树形选择 ​

含有下拉菜单的树形选择器，结合了 el-tree 和 el-select 两个组件的功能。

基础用法 ​

树状选择器

Select
show checkbox:
Select

选择任意级别 ​

当属性 check-strictly=true 时，任何节点都可以被选择，否则只有子节点可被选择。

Select
show checkbox(only click checkbox to select):
Select
show checkbox with `check-on-click-node`:
Select

TIP

当使用 show-checkbox时，由于 check-on-click-node 默认值是 false，这时候只能通过 checkbox 来选中，当然您也可以将其设置成 true，这样点击整个 node 都可以用来完成选择

多选 ​

通过点击或复选框选择多个选项。

Select
show checkbox:
Select
show checkbox with `check-strictly`:
Select

禁用选项 ​

使用 disabled 字段禁用选项。

Select

可筛选 ​

使用关键字筛选或自定义筛选方法。 filterMethod可以自定义数据筛选的方法， filterNodeMethod可以自定义节点数据筛选的方法。

Select
filter method:
Select
filter node method:
Select

自定义内容 ​

自定义树节点的内容。

Select
use render content:
Select

懒加载 ​

树节点懒加载，更加适合于数据量大的列表。

Select
2.2.26 show lazy load label:

API ​

Attributes ​

由于这个组件是el-tree和el-select的结合体，他们的原始属性未被更改，故不在此重复。请跳转查看原组件的相应文档。

属性方法事件插槽
treetreetreetree
selectselectselectselect

Own Attributes ​

属性名详情类型默认值
cacheData 2.2.26懒加载节点的缓存数据，结构与数据相同，用于获取未加载数据的标签object[]

类型声明 ​

显示类型声明
ts
type CacheOption = {
  value: string | number | boolean | object
  currentLabel: string | number
  isDisabled: boolean
}

源代码 ​

组件 • 样式 • 文档

贡献者 ​