树形控件

用于展示多层次结构列表的组件，支持展开、收起、选择等交互功能。

何时使用

常用于以下典型的层级结构展示：

• 文件夹结构
• 组织架构
• 生物分类
• 国家地区分布等

通过树形控件可清晰展现层级关系，提升信息组织与交互效率。

一、属性

1. 数据源

可通过以下方式绑定数据源：

• 接口绑定
• 数据绑定
• 模型绑定

详见：数据绑定

2. 数据配置

2.1 选项名称

配置树节点的显示文本内容。

2.2 选项值

配置每个节点被选中时返回的值。

2.3 选项子项

用于构建子节点层级，类型通常为数组，结构应与父节点一致。

2.4 父级 ID

设置父子关系的另一种方式。若节点 A 的 ID 为 1，节点 B 的父级 ID 设置为 1，则 B 为 A 的子节点。

注意：选项子项 与 父级 ID 只能启用其中之一。

示例结构：

3. 功能配置

3.1 默认首选项

开启后，页面加载时自动选中第一项节点。

• 关闭默认展开时效果：

  

3.2 默认展开

开启后，树控件加载时自动展开所有节点。

• 效果示意：

  

3.3 允许取消选择

点击已选中的节点将取消其选中状态。

3.4 虚拟滚动

当树形结构高度超过容器时，可启用虚拟滚动提升性能。

4. 外观设置

4.1 节点图标设置

可配置每个节点的图标、图标颜色与大小。

4.2 连接线与满宽设置

• 连接线：启用后显示节点间的层级连接线。
• 节点满宽：节点区域铺满整行宽度。

二、常见使用场景

与表格联动展示数据

例如：用树形控件展示城市列表，选中城市后展示对应的天气信息。

• 城市结构示意：

  

• 运行效果：