更新时间:2025-08-15 GMT+08:00
分享

设置物料插件的“树形控件”组件属性

适用场景

“树形控件”组件是展示层级结构数据的核心组件,专为呈现父子关系数据并支持节点选择而设计。通过直观的树状结构清晰展示组织架构、分类目录、项目结构等嵌套数据,支持单选或多选操作,帮助用户在复杂数据体系中快速定位目标,广泛适用于分类选择、权限配置、结构管理等业务场景。

基础信息

属性名

说明

支持变量绑定

组件名

树形控件组件的名称,默认为“树形控件”,不可修改。

×

rel引用类

树形控件组件的ID,系统自动生成,且不可修改。

×

Style

配置树形控件组件样式,支持通过CSS代码自定义树形控件组件的样式。

默认值

设置组件的预设选中节点,可通过JavaScript代码自定义(如默认选中“根节点”“当前部门节点”等)。

数据唯一标识

定义用于识别节点唯一性的字段名(如“id”“code”),确保系统准确区分不同节点。

父子关联选中

设置父子节点的选中状态是否联动

  • 关闭联动,父子节点选中状态独立,互不影响
  • 开启联动,选中父节点时自动勾选所有子节点,取消父节点时自动取消所有子节点子节点全部选中时父节点自动勾选,部分选中时父节点显示半选状态

更多选项类型

属性名

说明

支持变量绑定

懒加载

设置是否延迟加载子节点数据

  • 关闭懒加载,初始化时加载全部层级数据(首次加载稍慢,后续操作流畅)
  • 开启懒加载,仅加载当前层级数据,点击父节点时再加载子节点(初始化速度快,频繁切换节点时可能增加请求耗时)

加载子节点

通过JavaScript代码自定义子节点的加载逻辑(如调用接口根据父节点ID获取子节点数据)。

多选

设置是否支持选择多个节点

  • 仅可选择单个节点(单选模式)
  • 可选择多个节点(多选模式,选中节点以高亮或勾选框标记)

显示虚线

设置是否显示节点间的层级连接线

  • 不显示连接线,仅通过缩进区分层级
  • 显示虚线连接线,强化层级关系的视觉呈现

默认全部展开

设置初始化时节点展开状态

  • 默认仅显示根节点,子节点需手动展开
  • 初始化时自动展开所有层级节点

最大高度

设置树形控件的高度上限(数值越大,纵向可展示范围越广),超出部分将显示滚动条。

高级配置

属性名

说明

支持变量绑定

是否渲染

在页面开发中,可能需要根据某些条件来动态显示或隐藏页面中的组件内容,您可以设置此配置项。

  • :关闭渲染。
  • :开启渲染。

循环数据

表示需要循环渲染的数组。当页面存在若干份重复的、动态生成的内容时,您可以在高级面板中自定义循环数据。

迭代变量名

在循环渲染子项对应的变量名,默认为item。

×

索引变量名

循环渲染的索引变量名,默认为index。

×

key

用于标识每个循环项的唯一键值,默认为index。建议根据实际需求选择一个更合适的字段作为唯一标识符,以提高性能和避免潜在问题。

×

相关文档