分为顶部导航和侧边导航，顶部导航提供全局性的类目和功能，侧边导航提供多级结构来收纳和排列网站架构。
Nav 继承自 Menu，除特殊说明外，可使用 Menu 的 API。
内嵌菜单可以被缩起/展开。 Nav背景与环境背景不同? 开启embeddable试试，完美嵌入环境:
embeddable 模式后，Nav组件适合被嵌入到有背景色的页面部分，当作导航。可以根据背景色色系选择不同的type；embeddable 模式时，Nav组件将带有背景色、border、阴影等，可以单独使用。| 参数 | 说明 | 类型 | 默认值 | 是否必填 | 支持版本 |
|---|---|---|---|---|---|
| children | 导航项和子导航 | React.ReactNode | - | - | |
| defaultOpenAll | 初始展开所有的子导航 | boolean | false | - | |
| mode | 子导航打开的模式 | 'inline' | 'popup' | 'inline' | - | |
| triggerType | 子导航打开的触发方式 | 'click' | 'hover' | 'click' | - | |
| openMode | 内联子导航的展开模式，同时可以展开一个同级子导航还是多个同级子导航 | 'single' | 'multiple' | 'multiple' | - | |
| inlineIndent | 内联子导航缩进距离 | number | 20 | - | |
| popupAlign | 弹出子导航的对齐方式 | 'follow' | 'outside' | 'follow' | - | |
| popupClassName | 弹出子导航的自定义类名 | string | - | - | |
| selectedKeys | 当前选中导航项的 key 值 | string | Array<string> | - | - | |
| defaultSelectedKeys | 初始选中导航项的 key 值 | string | Array<string> | [] | - | |
| onSelect | 选中或取消选中导航项触发的回调函数 签名: 参数: selectedKeys: 选中的导航项的 key 值 item: 选中的导航项 extra: 扩展参数 |
(selectedKeys: string[], item: SelectableItem, extra: SelectExtra) => void | - | - | |
| direction | 导航布局 | 'hoz' | 'ver' | 'ver' | - | |
| hozAlign | 横向导航条 items 和 footer 的对齐方向 | 'left' | 'right' | 'left' | - | |
| header | 自定义导航头部 | React.ReactNode | - | - | |
| footer | 自定义导航尾部 | React.ReactNode | - | - | |
| embeddable | 是否开启嵌入式模式 | boolean | false | 1.18 | |
| type | 导航类型 | 'normal' | 'primary' | 'secondary' | 'line' | 'normal' | - | |
| activeDirection | 设置组件选中状态的 active 边方向 | null | 'top' | 'bottom' | 'left' | 'right' | - | - | |
| iconOnly | 是否只显示图标 | boolean | - | - | |
| iconTextOnly | iconOnly 模式下是否展示文字 | boolean | - | - | |
| iconOnlyWidth | iconOnly 模式下的宽度 | number | string | - | - | |
| hasArrow | 是否显示右侧的箭头 | boolean | true | - | |
| hasTooltip | 是否有 ToolTips | boolean | false | - |
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| label | 标签内容 | React.ReactNode | - | |
| children | 导航项和子导航 | React.ReactChild | React.ReactChild[] | - | 是 |
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| icon | 自定义图标 | string | React.ReactNode | - | |
| children | 导航内容 | React.ReactNode | - |
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| label | 标签内容 | React.ReactNode | - | |
| children | 弹出内容 | React.ReactNode | - | |
| icon | 自定义图标 | string | React.ReactNode | - |
| 参数 | 说明 | 类型 | 默认值 | 是否必填 |
|---|---|---|---|---|
| icon | 自定义图标 | string | React.ReactNode | - | |
| label | 标签内容 | React.ReactNode | - | |
| selectable | 是否可选 | boolean | false | |
| children | 导航项和子导航 | React.ReactNode | - | |
| noIcon | 是否需要提示当前项可展开的 icon，默认是有的 | boolean | - |
| 按键 | 说明 |
|---|---|
| Up Arrow | 导航到上一项 |
| Down Arrow | 导航到下一项 |
| Right Arrow | 打开子菜单，导航到子菜单第一项；横向菜单条第一层，导航到右一项 |
| Left Arrow | 关闭子菜单，导航到父级菜单；横向菜单条第一层，导航到左一项 |
| Enter | 打开子菜单，导航到子菜单第一项 |
| Esc | 关闭子菜单，导航到父级菜单 |
defaultOpenKeys 不生效，有什么解决办法？ #原因：defaultXXX系列API遵循React的设计规范，仅在组件第一次渲染的时候生效，所以defaultOpenKeys仅仅对Menu在didMount阶段拿到的Children生效，异步获取的信息不在这个阶段内，所以不生效。
解决方法：假设菜单信息是异步获取后塞到 menuData 变量中的，可以设置 {menuData && <Menu />}。