1.简介
树状导航是纵向导航中的一种,因其形状像树的分支结构而得名,树形通过逐级大纲的形式来展现信息的层级关系,高效且具有极佳的视觉可视性,使得整体信息框架一目了然。适用于 项目管理、CRM管理、物资管理、合同管理、文件管理等带有数据分类性质的且分类较多的系统中。
为满足用户的这一需求,「搭贝」提供了 树状结构(左侧)+数据展示(右侧) 的数据展示方式,可通过与当前表单数据相关联的其他表单数据生成左侧树。
2. 设置步骤
2.1举例--使用其他表单数据生成树
业务表单使用关联表单、下拉单选引用了其他表单的数据,希望使用引用的数据生成左侧树。
2.1.1创建生成树的表单
创建一个生成树的表单「区域」,表单中增加单行文本 区域名 、关联表单 上级 / 下拉单选 上级。
- 关联表单选择的表单是自己,关联字段选择的是
区域名; - 下拉单选使用远端数据,内联表单选择的是自己,内联字段选择的是
区域名;
![]() |
|---|
![]() |
![]() |
2.1.2 创建业务表单
创建业务表单,增加关联表单 所属区域 / 下拉单选 所属区域。
- 关联表单组件的被关联表单选择的是
区域表单,关联字段选择的是区域名; - 下拉单选使用远端数据,内联表单选择的是
区域表单,内联字段选择的是区域名;
![]() |
|---|
![]() |
|---|
2.2举例--使用当前表单字段生成树
可使用当前表单的下拉单选组件生成树,前提是 下拉单选的选项使用的是静态数据。 创建业务表单,增加下拉单选 客户类型,下拉单选使用静态数据。
![]() |
|---|
![]() |
|---|
3.容易遇到的问题及解决方案
问题1:业务数据与左侧树没有关联如何展示
解决方案:提供未分类节点的展示,所有与树节点无关的数据都可展示在此节点中
问题2:树的层级太深,找东西困难
解决方案:
1)提供树节点的关键字搜索
2)提供树的默认展开层级,每次进入列表不用每个节点展开收起都需要点击
问题3:树节点的顺序每次都会发生变化,无法形成记忆
解决方案:提供用户自定义顺序,可根据生成树的表单中某一字段进行排序,如 序号、创建时间等
问题4:对于一些作废的数据,不想在树上展示
解决方案:提供树节点的过滤,可通过配置过滤条件只把有效数据生成树
问题5:查看数据需要点一级看一级,太麻烦
解决方案:在树的下方提供查询节点及所有子节点的数据功能,可点击树节点,显示本节点及下属所有节点关联详情数据






