#### `dialog提示窗`
[预览](https://aui-js.github.io/aui/pages/api/plugs/dialog.html) </br>
参数 | 类型 | 描述 | 默认值 | 必选
---- | ----- | ------ | ----- | ----
warp | string | 父容器元素 | 'body' | 否
title | string | 标题 | '' | 否
msg | string | 提示内容 | '' | 是
btns | arr | 按钮，默认按钮为“确定” 分别可设置btns值为</br>1：['按钮1', '按钮2']</br>2：[{name: '按钮1', color: ''},{name: '按钮2', color: ''}] | ["确定"] | 否
mask | boolean | 是否显示遮罩蒙版 | true | 否
touchClose | boolean | 触摸遮罩是否关闭模态弹窗 | true | 否
theme | number | 主题样式，控制模态弹窗按钮显示风格(1: 大按钮; 2: 小按钮-居右分布; 3: 按钮宽度等于父级宽度100%，适用于按钮文字过多情况) | 'col' | 否
items | arr | prompt--input框列表配置</br>[{label: '姓名：', type: 'text', value: '(可选)', placeholder: '请输入姓名'}] | [] | 否
duration | number | 显示时间 | 2000 | 否
style | object | {</br> w: '', //--可选参数，模态窗宽度，默认80%</br> h: '', //--可选参数，模态窗高度，默认"auto"自适应</br> bg: '',//--可选参数，模态窗背景色，默认白色</br> zIndex: '', //--可选参数，模态窗层级</br> title: {</br> bg: "",</br> color: "",</br> lineHeight: "",</br> textAlign: "",</br> fontSize: "",</br> padding: ""</br>}} | '' | 否
````html
<link rel="stylesheet" type="text/css" href="https://aui-js.github.io/aui/static/css/aui.min.css"/>
<script type="text/javascript" src="https://aui-js.github.io/aui/static/js/aui.min.js"></script>
````
> 1、alert单按钮提醒弹窗
````javascript
aui.alert({
title: "提示", //可选
msg: "您点击了alert单按钮模态弹窗！",
mask: true,
touchClose: true, //可选
btns: ["确定"], //可选
//或btns: [{name: '按钮1', color: '#f00'},{name: '按钮2', color: '#00f'}], //可选
theme: 1, //可选
style: { //可选
w: "75%",
h: "auto",
bg: '#FFF',
zIndex: 999,
animate: "aui-scale-in-tosmall-dialog",
title: {
bg: "#FFF",
color: "#333",
lineHeight:"55px",
fontSize: "17px",
textAlign: "center",
padding: "0px"
}
}
},function(ret){
console.log(ret.index);
if(ret.index == 0){
aui.toast({msg: "您点击了确定"});
}
});
````
> 2、confirm双按钮提醒弹窗
````javascript
aui.confirm({
msg: "您点击了confirm双按钮模态弹窗！",
btns: ["取消", "确定"],
},function(ret){
console.log(ret.index);
if(ret.index == 1){
aui.toast({msg: "您点击了确定"});
}
});
````
> 3、delete删除提醒弹窗
````javascript
aui.delete({
msg: "您点击了delete删除模态弹窗！",
btns: ["取消", "删除"],
},function(ret){
console.log(ret.index);
if(ret.index == 1){
aui.toast({msg: "您点击了删除"});
}
});
````
> 4、prompt输入弹窗
````javascript
aui.prompt({
items: [{
label: '姓名：',
type: 'text',
value: '',
placeholder: '请输入姓名'
},{
label: '年龄：',
type: 'number',
value: '',
placeholder: '请输入年龄'
}],
btns: ["取消", "确定"],
},function(ret){
console.log(ret.data);
if(ret.index == 1)
{
aui.alert({
title: "输入结果：",
msg: "<div style='text-align: left;'>姓名：" + ret.data[0] + "</br>年龄：" + ret.data[1]+"</div>",
btns: ["确定"],
}, function(ret){
if(ret.index == 0){
aui.toast({msg: "您点击了确定"});
}
});
}
});
````
> 5、confirm带图标双按钮提醒弹窗
````javascript
aui.confirm({
msg: "<div style='text-align: center;'>"
+"<img src='../../img/success-green.png' style='width: 60px; margin: 0 auto;'>"
+"<p style='width: 100%; line-height: 25px; color: 15px;'>带图标模态弹窗</p>"
+"</div>",
btns: ["取消", "确定"],
},function(ret){
console.log(ret.index);
if(ret.index == 1){
aui.toast({msg: "您点击了确定"});
}
});
````
> 6、多按钮弹窗
````javascript
aui.confirm({
msg: "您点击了多按钮弹窗！",
btns: [{name: '残忍拒绝', color: ''},{name: '再逛逛', color: ''}, {name: "返回首页", color: "#909090"}], //可选
theme: 3, //可选
},function(ret){
console.log(ret.index);
if(ret.index == 0){
aui.toast({msg: "您点击了残忍拒绝"});
}
else if(ret.index == 1){
aui.toast({msg: "您点击了再逛逛"});
}
else if(ret.index == 2){
aui.toast({msg: "您点击了返回首页"});
}
});
````
