← 返回 Web 词条

树状数据表

Web需自己实现

Web 原生没有这个

网页没有原生树状数据表,它同时需要树形展开与数据网格键盘导航,交互复杂度很高。

通常怎么做:按 APG Treegrid 模式实现,或把层级导航和详情表格拆开以降低复杂度。

适用范围:桌面现代浏览器

社区一般叫它 Treegrid

它把可展开的父子层级和多列表格结合,让用户同时查看结构与各项字段。

  • 表格里的行还能展开出子行
  • 既有列又有父子层级的数据表
  • 像项目计划那样能展开任务的表
  • 树形网格
  • 层级数据表
  • 可展开表格

其他平台的相似实现

iOS需自己实现
该平台没有原生实现

苹果平台没有通用树状数据表组件,OutlineGroup 与 Table 不能直接组合出完整键盘和编辑行为。

看 iOS 视角 →
Android需自己实现
该平台没有原生实现

Android 没有树状数据表组件,列表、表格布局和层级状态都需要自行组合。

看 Android 视角 →

使用规范

什么时候用

  • 专业桌面或大屏工具需要同时比较层级项目的多个字段

什么时候别用

  • 普通移动端、只需查看层级,或没有足够资源实现完整键盘与无障碍行为

容易混淆

Web 出处

查看 Web / iOS / Android 完整对照 →