## NavMenu 导航菜单
为网站提供导航功能的菜单。
### 顶栏
适用广泛的基础用法。
::: demo 导航菜单默认为垂直模式,通过`mode`属性可以使导航菜单变更为水平模式。另外,在菜单中通过`submenu`组件可以生成二级菜单。Menu 还提供了`background-color`、`text-color`和`active-text-color`,分别用于设置菜单的背景色、菜单的文字颜色和当前激活菜单的文字颜色。
```html
```
:::
### 侧栏
垂直菜单,可内嵌子菜单。
::: demo 通过`el-menu-item-group`组件可以实现菜单进行分组,分组名可以通过`title`属性直接设定,也可以通过具名 slot 来设定。
```html
  
    默认颜色
    
  
  
    自定义颜色
    
  
```
:::
### 折叠
::: demo
```html
  展开
  收起
```
:::
### Menu Attribute
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| mode     | 模式   | string  |   horizontal / vertical   | vertical |
| collapse  | 是否水平折叠收起菜单(仅在 mode 为 vertical 时可用)| boolean  |   —   | false |
| background-color  | 菜单的背景色(仅支持 hex 格式) | string |   —   | #ffffff |
| text-color  | 菜单的文字颜色(仅支持 hex 格式) | string |   —   | #2d2f33 |
| active-text-color  | 当前激活菜单的文字颜色(仅支持 hex 格式) | string |   —   | #409EFF |
| default-active | 当前激活菜单的 index | string    | — | — |
| default-openeds | 当前打开的sub-menu的 key 数组 | Array    | — | — |
| unique-opened  | 是否只保持一个子菜单的展开 | boolean   | — | false   |
| menu-trigger  | 子菜单打开的触发方式(只在 mode 为 horizontal 时有效) | string   | — | hover   |
| router  | 是否使用 vue-router 的模式,启用该模式会在激活导航时以 index 作为 path 进行路由跳转 | boolean   | — | false   |
### Menu Methods
| 事件名称      | 说明    | 参数      |
|---------- |-------- |---------- |
| open  | 展开指定的 sub-menu | index: 需要打开的 sub-menu 的 index |
| close  | 收起指定的 sub-menu | index: 需要收起的 sub-menu 的 index |
### Menu Events
| 事件名称      | 说明    | 回调参数      |
|---------- |-------- |---------- |
| select  | 菜单激活回调 | index: 选中菜单项的 indexPath: 选中菜单项的 index path  |
| open  | sub-menu 展开的回调 | index: 打开的 sub-menu 的 index, indexPath: 打开的 sub-menu 的 index path  |
| close  | sub-menu 收起的回调 | index: 收起的 sub-menu 的 index, indexPath: 收起的 sub-menu 的 index path  |
### SubMenu Attribute
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| index     | 唯一标志   | string  | — | — |
### Menu-Item Attribute
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| index     | 唯一标志   | string  | — | — |
| route     | Vue Router 路径对象 | Object | — | — |
### Menu-Group Attribute
| 参数      | 说明    | 类型      | 可选值       | 默认值   |
|---------- |-------- |---------- |-------------  |-------- |
| title     | 分组标题   | string  | — | — |