认导航
面包屑
Breadcrumb
「顶部那一串路径」「带斜杠的导航」「能点回去的路径」「当前位置那一行」「层级小字」「返回上一级的链接」「首页杠某某」
LIVE DEMO真实可交互，动手试试
当前位置：词条
- 英文名
- Breadcrumb
- 别名 · 俗称
- 面包屑导航路径导航层级路径shadcn: Breadcrumb
- Web 叫法
- Breadcrumb
- 大白话定义
- 页面顶部一串带斜杠的路径，告诉你当前在哪一层，点任意一级能跳回去。
- 部位拆解
- 层级项 Item每一级页面的名字，一般可点击
- 分隔符 Separator层级之间的 / 或 > 符号
- 当前页 Current最后一级，不可点，表示所在位置
提示词已按当前平台组织好，复制粘贴给 AI 即可
Web
在内容区顶部加面包屑（Breadcrumb）：首页 / 商品 / 详情，前两级可点击返回，当前页置灰
调试 Prompt组件不听话时用——把症状补在末尾一起发给 AI
调试我的面包屑（Breadcrumb）。逐一排除：层级太深不换行也不折叠，把顶部布局撑破；当前页最后一级做成了可点击链接，应该置灰禁点；路由跳转后面包屑还显示缓存的旧路径；缺 aria-current 和导航语义标记，读屏用户听不出当前位置。症状是：