SuperAPI AI 工具集

navigation

通用与其它

查看项目

更新于 10-15 19:52

技能介绍

用途:在构建应用导航时提供结构决策,把导航视为信息架构的呈现,而非叠加层。核心取向是尽可能扁平、单一主索引、以 URL 作为位置与内容的唯一真相来源。它只管移动图谱,不指定容器(弹窗、抽屉、内联展开或整页由 modal-or-page 决定);单页内排列属于布局,切换时机属于 transitions。

主要能力:提供按原型划分的导航骨架(仪表盘、设置、列表-详情、记录子标签、文档、内容站),并给出一张导航形态决策表:同一对象的平级视图用标签页,固定区域用常驻侧边栏,窄屏用底部栏,无界数据集用搜索/命令面板加置顶与最近列表,侧边栏下一层用面包屑。原则包括最多三层可达深度、每路由点亮且仅点亮一个导航项、激活态不依赖颜色且用 aria-current="page"、目的地用 push 而视图调整用 replace、应用内返回指向父级并标出目的地名、可重载保留的状态放入 URL、返回时恢复滚动、标签用用户词汇。

使用方式:先读项目已有路由(Next App Router、React Router、TanStack Router、SvelteKit、Nuxt、Expo Router),导航状态放在路由器既有机制(Link、useSearchParams、loaders)中,避免用并行的 useState 遮蔽 URL;若设计系统已有导航原语则扩展它。确定原型后查阅 patterns.md。资料未提供安装或调用命令。

限制与例外:用户生成层级(文件、文件夹、组织图)可无界并配完整面包屑与搜索;内容型标签(打开的文件、频道)可滚动;全局路由(全屏搜索、结账、引导)可完全不显示导航;超长筛选状态可服务端持久化并将 id 放入 URL。敏感值不放查询字符串;跳转目标等无障碍实现归 a11y。