导航菜单Menu
页面导航组织主要页面入口，并标出当前位置
导航菜单把产品里的页面和功能入口按层级组织起来，可以横排、竖排或展开子菜单。它通常负责前往不同位置；切换同一对象里的平级内容时，标签页更合适。
什么时候用
- 产品有多个页面，需要一个常驻的「导航中枢」首页产品文档定价
- 后台系统用侧边栏，几十个功能页也能组织清楚仪表盘项目成员设置
- 功能有层级，用分组和子菜单一层层收纳项目全部项目我负责的系统成员设置
- 高亮当前页，用户随时知道自己在哪概览数据成员高亮告诉你：现在在这儿
什么时候不用
- 同一页面里切换并列内容 → 那是 标签页 Tabs 的活评论历史收藏
- 菜单项十几个不分组，一眼望不到头仪表盘项目任务文件成员日程报表消息设置回收站
- 不要把保存、删除等当前页面动作混进导航菜单保存删除导出
- 只有两三个入口的小页面 → 菜单纯属摆设首页关于
组成结构 · Anatomy
1菜单容器Container整条菜单，负责排列菜单项和管理高亮状态
2菜单项MenuItem一个可点入口，点击跳转到对应页面
3图标Icon可选，帮用户一眼认出这是什么功能
4徽标Badge可选，提示未读数或有新内容
常见变体 · Variants
水平导航Horizontal
入口不多、横向空间够,适合官网顶栏
侧边导航Vertical
功能多到几十个,竖排才装得下
收起态Collapsed
内容区不够宽时,收成一排图标
典型使用场景
后台管理系统侧边栏
网站顶部主导航
文档站多级目录
移动端抽屉菜单
林小狐