# layui扩展模块-菜单

**Repository Path**: it0662/layui_extension_modulemenu

## Basic Information

- **Project Name**: layui扩展模块-菜单
- **Description**: 基于layui自带菜单开发的简单组件，支持传递json渲染，设置选中项目
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 2
- **Created**: 2022-03-24
- **Last Updated**: 2022-03-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### layui扩展模块 - enianMenu  开发文档
> 菜单最多支持到二级菜单 ，后续可能扩展更新支持更多。

<a id="yanshi"></a>
#### 详细文档及演示 [演示地址](http://doc.enianteam.com/demo/enian_menu_1.html "演示地址")
http://doc.enianteam.com/layui_module/43.html

<a id="shujushili"></a>
#### 数据格式示例
```json
[{"id":28,"title":"主页","img":"","type":"0","aid":1,"url":"/admin/index/applist.html","pid":"20"}
 ,{"id":27,"title":"管理员列表","img":"","type":"0","note":'我是管理员列表',"aid":1,"url":"/adminlist.html","pid":"25"}
 ,{"id":26,"title":"应用管理","img":"","type":"0","aid":1,"url":"/admin/index/applist.html","pid":"25"}
 ,{"id":20,"title":"首页","img":"","type":null,"note":'我是首页',"aid":1,"pid":"0","open":true}
 ,{"id":25,"title":"分组2","img":"","type":null,"aid":1,"pid":"0"}
 ,{"id":21,"title":"可点击分组","img":"","note":'我是可点击分组',"type":null,"aid":1,"url":"/admin/666.html","pid":"0"}]
```
| 参数 |  必须 | 示例 |解释|
| --- | ---|---|---|
|  id | 是  | 1|num 唯一id|
|pid  | 是  |0/group|当pid为0或者等于"group"则识别为分组
|title|是|str|菜单标题名
|url  | 否  |str|此参数为空，被点击不会激发菜单点击事件，分组中填写url则默认无二级可点击分组
|note  | 否  |str|鼠标停留到菜单上会弹出备注信息
|checked|否|true |设置是否选中
|img|否|str|随意支持图标标签和图片标签
|name|否|随意| |
|open|否|true| 展开分组（注：仅当pid为0或者为"group"，并且不是可点击分组时有效）|
|type|否|随意| ||

<a id="render"></a>
#### 渲染菜单
```javascript
menu.render(data,'#menu_left',function(obj){
   var url = obj.url;
   console.log(obj)
})
```
| 参数  |  类型 | 解释 
| ------------ | ------------ | ------------ |
| 参1  | arr  | 数组对象|
| 参2  | str  | DOM容器|
| 参3  | func | 菜单点击回调|

注意：当url参数内容为空的时候无法回调

<a id="setCheck"></a>
#### 动态设置选中内容
```javascript
//设置完成返回 true，没有项目返回 false。19-1-6 新增返回值
menu.setCheck(key,value);
```
|  参数 |  解释 |
| ------------ | ------------ |
| key  | 数组中设定的key，可选值有 id type name title url |
| value  | 数组中设定key的值  |

```javascript
//示例
//以下代码实现：title 字段为“系统设置”的项目将选中
menu.setCheck("title","系统设置");
```
----文档结束----