qt-public-ui/es/Nav/index.zh-CN.md

新设计规范下业务组件库

## Nav

SimpleMenu：

当UmProvider 的 theme 为operational 且 mode !== 'horizontal'是 自动切换为SimpleMenu

不具备[antd Menu](https://ant.design/components/menu-cn/#Menu)的参数,但具备原生节点ul的所有参数

DefaultMenu：

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| options | 配置选项 |  [SimpleMenuConfig](/#/ui/Nav/#simplemenuconfig) | - |
| selected | 当前选中的tab（受控） | string | - | 


DefaultMenu：

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| options | 配置选项 |  [MenuTitle](/#/ui/Nav/#menutitle) \| [MenuChild](/#/ui/Nav/#menuchild) | - |
| appSelect | 用于展示app选择狂 | React.ReactElement | - |
| selected | 当前选中的tab（受控） | string | - | 
| className | className | string | - |


以下参数继承自[antd Menu](https://ant.design/components/menu-cn/#Menu)：


| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| ~~defaultOpenKeys~~ | 初始展开的 SubMenu 菜单项 key 数组 | string\[] | - |  |
| ~~defaultSelectedKeys~~ | 初始选中的菜单项 key 数组 | string\[] | - |  |
| expandIcon | 自定义展开图标 | ReactNode \| `(props: SubMenuProps & { isSubMenu: boolean }) => ReactNode` | - | 4.9.0 |
| forceSubMenuRender | 在子菜单展示之前就渲染进 DOM | boolean | false |  |
| inlineCollapsed | inline 时菜单是否收起状态 | boolean | - |  |
| inlineIndent | inline 模式的菜单缩进宽度 | number | 24 |  |
| mode | 菜单类型，现在支持垂直、水平、和内嵌模式三种 | `vertical` \| `horizontal` \| `inline` | `vertical` |  |
| multiple | 是否允许多选 | boolean | false |  |
| ~~openKeys~~ | 当前展开的 SubMenu 菜单项 key 数组 | string\[] | - |  |
| overflowedIndicator | 自定义 Menu 折叠时的图标 | ReactNode | - |  |
| selectable | 是否允许选中 | boolean | true |  |
| ~~selectedKeys~~ | 当前选中的菜单项 key 数组 | string\[] | - |  |
| style | 根节点样式 | CSSProperties | - |  |
| subMenuCloseDelay | 用户鼠标离开子菜单后关闭延时，单位：秒 | number | 0.1 |  |
| subMenuOpenDelay | 用户鼠标进入子菜单后开启延时，单位：秒 | number | 0 |  |
| theme | 主题颜色 | `light` \| `dark` | `light` |  |
| triggerSubMenuAction | SubMenu 展开/关闭的触发行为 | `hover` \| `click` | `hover` |  |
| onClick | 点击 MenuItem 调用此函数 | function({ item, key, keyPath, domEvent }) | - |  |
| onDeselect | 取消选中时调用，仅在 multiple 生效 | function({ item, key, keyPath, selectedKeys, domEvent }) | - |  |
| ~~onOpenChange~~ | SubMenu 展开/关闭的回调 | function(openKeys: string\[]) | - |  |
| onSelect | 被选中时调用 | function({ item, key, keyPath, selectedKeys, domEvent }) | -   |  |

> 更多属性查看 [rc-menu](https://github.com/react-component/menu#api)



#### MenuTitle

nav 的父节点

| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| children | [MenuChild](/#/ui/Nav/#menuChild)[] | 是
| title | 标题 | string | 是 | 
| icon | 自定义icon | string | 否 |

#### MenuChild

nav 的子节点

| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| link | 跳转链接 | string | 是 |
| title | 标题 | string | 是 | 
| target | 同 a 标签的target | `_blank` \| `_self` \| `_parent` \| `_top` | 否 |
| pattern | 对于pathname的正则匹配 ｜ RegExp | 否 ｜
| icon | 自定义icon | string | 否 |
| node | 自定义sufix ｜ React.ReactNode | 否 |

#### SimpleMenuConfig

| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| link | 跳转链接 | string | 是 |
| title | 标题 | string | 是 | 
| target | 同 a 标签的target | `_blank` \| `_self` \| `_parent` \| `_top` | 否 |
| pattern | 对于pathname的正则匹配 ｜ RegExp | 否 ｜
| icon | 自定义icon | string | 是 |
| node | 自定义sufix ｜ React.ReactNode | 否 |