如何使用
- 树用于多层级数据的结构化展示,例如显示文件夹与文件的列表、显示组织架构成员列表等等。
- 树可以作为选择器来选择多级数据,也可以作为多级导航。
解构
- 展开小三角 :表示该节点包含子级节点,用户通过点击此图标来展开/折叠该节点的子节点。
- Checkbox 当树需要多选操作时,可以使用 Checkbox。不同节点之间的 Checkbox 可能存在关系。父节点的 Checkbox 选中状态受子级节点影响。若不需要多选操作,可不显示 Checkbox。
- 文本 普通文本,如有需要,可在文本前放置图标。
- 父级节点 父级节点带有一个“展开小三角”。
- 子级节点 子级节点较父级节点有锁进。
组件 Demo
✅ ️ Figma Variants
常规型
带图标的
目录树模式
目录树模式下自带目录图标,多用于文档结构