#### `selectmenu下拉列表选择菜单`
[预览](https://aui-js.github.io/aui/pages/api/plugs/selectmenu.html) </br>
参数 | 类型 | 描述 | 默认值 | 必选
---- | ----- | ------ | ----- | ----
warp | string | 父容器元素 | 'body' | 否
data | arr | 菜单列表[{value: '', text: ''}] | [] | 是
layer | number | 控制组件为几级 | 1 | 是
mask | boolean | 是否显示遮罩蒙版 | true | 否
touchClose | boolean | 触摸遮罩是否关闭侧滑菜单 | true | 否
checkedMore | boolean | 是否多选(多选限制最后一级可多选) | false | 否
before | function | 打开弹窗前执行 | null | 否
select | function | 一级以上点击选择后执行，获取下级数据并return | null | 否
style | object | 样式 | {</br>width: '',</br> height: '',</br> top: '',</br> left: '',</br> padding: '',</br> background: '',</br> borderRadius: '',</br> itemStyle:{</br>textAlign: '',</br>fontSize: '',</br>color: '',</br>isLine: false, //是否显示分割线</br>}</br>} | 否
````html
<link rel="stylesheet" type="text/css" href="https://aui-js.github.io/aui/static/css/aui.min.css"/>
<link rel="stylesheet" type="text/css" href="https://aui-js.github.io/aui/static/css/aui.selectmenu.css"/>
<script type="text/javascript" src="https://aui-js.github.io/aui/static/js/aui.min.js"></script>
<script type="text/javascript" src="https://aui-js.github.io/aui/static/js/aui.selectmenu.js"></script>
````
> 打开：
````javascript
aui.selectMenu.open({
warp: '.orderby-items',
layer: layer, // 1,2,3...
data: [
{value: '0', text: '昨天'},
{value: '1', text: '本周'},
{value: '2', text: '上周'},
{value: '3', text: '本月'},
{value: '4', text: '上月'},
],
checkedMore: true,
select: function(ret){ //点击时获取下级数据
//console.log(ret); //{value: '0', text: '昨天'}
if(ret.pindex == 0){
//ajax -- 参数如ret.value
var data = [
{value: '1', text: '1点'},
{value: '2', text: '2点'},
{value: '3', text: '3点'},
{value: '4', text: '4点'},
{value: '4', text: '5点'},
{value: '4', text: '6点'},
{value: '4', text: '7点'},
{value: '4', text: '8点'},
{value: '4', text: '9点'},
{value: '4', text: '10点'},
{value: '4', text: '11点'},
{value: '4', text: '12点'},
];
}
else if(ret.pindex == 1){
var data = [
{value: '0', text: '10分'},
{value: '1', text: '20分'},
{value: '2', text: '30分'},
{value: '3', text: '40分'},
{value: '4', text: '50分'},
{value: '4', text: '60分'},
];
}
return data
},
}, function(ret){
isShowModal = false;
for(var i = 0; i < is.parentNode.querySelectorAll('.orderby-item').length; i++){
is.parentNode.querySelectorAll('.orderby-item')[i].classList.remove('active');
}
});
````
> 关闭
````javascript
aui.selectMenu.close(function(){
if(ret && ret.status == 0){
console.log(ret);
if(ret.data.length > 0){
is.classList.add("selected");
is.querySelector("span").innerText = '';
for(var i = 0; i < ret.data[ret.data.length-1].length; i++){
if(i != ret.data[ret.data.length-1].length - 1){
is.querySelector("span").innerText += ret.data[ret.data.length - 1][i].text + ',';
}
else{
is.querySelector("span").innerText += ret.data[ret.data.length - 1][i].text
}
}
}
else{
is.classList.remove("selected");
is.querySelector("span").innerText = '三级列表';
}
}
});
````
