# NavMenu 导航菜单
提供导航功能的菜单。
上边：子菜单通过hover触发
▼显示代码
上边（暗黑皮肤）：子菜单通过hover触发
▼显示代码
左侧：子菜单通过hover触发
▼显示代码
左侧（暗黑皮肤）：子菜单通过hover触发
▼显示代码
左侧：子菜单通过click触发
▼显示代码
左侧（暗黑皮肤）：子菜单通过click触发
▼显示代码
上边（暗黑皮肤）：指定高度(100px)和宽度(800px)
▼显示代码
左侧（暗黑皮肤）：指定高度(500px)和宽度(500px)
▼显示代码
左侧（暗黑皮肤）：默认为折叠状态
▼显示代码
# 参数列表
| 参数 | 说明 | 类型 | 可选值 | 默认值 | ||
|---|---|---|---|---|---|---|
| elObj | - | - | 被渲染的dom(必填) | 可传入一个 DOM 对象或字符串； 若传入字符串，则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点 | - | |
| options（类型：object）(必填项) | position | 菜单的位置：上边/左侧（选填） | string | "top" "left" | "top" | |
| themes | - | 皮肤风格：明亮/暗黑（选填） | string | "light" "dark" | "light" | |
| width | - | 菜单的宽度（选填） | string / number 支持格式： 1、"100%" 2、100（组件会自动转换为100px） | position为"top"时：100% position为"left"时：240px | ||
| height | - | 菜单的高度（选填） | string / number 支持格式： 1、"100%" 2、100（组件会自动转换为100px） | position为"top"时：50px position为"left"时：100% | ||
| triggerMode | - | 子级菜单的展现方式（选填） hover: 鼠标移入时显示子菜单 click: 鼠标点击时显示子菜单 | string
| "hover" "click" | "hover" | |
| stretch | - | 是否处于展开状态（选填） | Boolean | true false | true | |
| item（类型：array）,由1-N个object组件 每个object下的内容包含右侧这些 | id | 当前菜单的id(选填) | string/number | |||
| icon | 当前菜单的图标（选填） | string | ||||
| name | 当前菜单的文字（必填） | string | ||||
| url | 当前菜单的链接（选填） | function | ||||
| target | 打开当前链接的iframe的id或name（如果url有值时必填，否则选填） | string | ||||
| clickFun | 当前菜单的自定义事件（选填） | function | ||||
| current | 当前菜单是否处于高亮状态（选填） | Boolean | true false | false | ||
# 方法列表(以对象方式渲染时)
| 方法 | 说明 | 参数 |
|---|---|---|
| stretchOn | 展开菜单（仅左侧菜单支持） | - |
| stretchOff | 收起菜单（仅左侧菜单支持） | - |
| destory | 销毁元素 | - |