树形控件Tree
你可能会说
文件夹那种一层层展开的,点小三角展开下一级。
把文件夹、部门或分类按父子关系排列,并让用户逐层展开或收起例如项目文件会显示“src”文件夹,展开后才能看到里面的页面文件。它主要帮助浏览层级;需要从中勾选并提交结果时,应使用 树选择 Tree Select。
组成结构 · Anatomy
▾设计部▸UI 组
整棵树的容器
有子节点才有,点击展开 / 收起
节点名称,可高亮选中
缩进一级,表示从属关系
常见变体 · Variants
可勾选Checkable
▾页面权限
查看
编辑
要在层级里批量选择,比如配权限
带连接线ShowLine
▾设计部
▸UI 组
▸用研组
需要加强父子节点归属辨识时
目录树Directory
▾📁 设计资源
📄 首页.sketch
📄 图标.sketch
展示文件目录,配文件夹图标更直观
典型使用场景
文件目录浏览
组织架构选人
选择审批人
▾🏢 某某科技
▾设计部
▸研发部
权限配置勾选
角色权限 · 运营已选 3 / 6 项
▾内容管理
发布文章
删除他人文章
▸数据看板
商品分类管理
商品分类
▾数码家电128 件编辑
耳机音箱46 件
智能穿戴32 件
▸家居生活96 件
延伸阅读 · 权威出处