元素-Ui组件消息框弹出窗口
基本用法
消息提示框
```
单击以打开消息框exportdefault {methods: {？Open() {this。$alert('这是一段内容'，'标题名'，{？ConfirmButtonText:' OK '，？回调:action = & gt{这个。$message({？键入:' info '，消息:` action:$ { action } `})；？} });？} }?}
单击以打开消息框exportdefault { methods:{ open(){ this。$ alert('这是一个段落'，'标题名'，{confirmButtonText:' OK '，callback:action = & gt；{这个。$message({ type:'info '，message:` action:$ { action } `})；} });}}}单击以打开message boxexportdefault { methods:{ open(){ this。$ alert('这是一个段落'，'标题名'，{confirmButtonText:' OK '，callback:action = & gt；{这个。$message({ type:'info '，message:` action:$ { action } `})；} });} } } & lt模板& gt
？& ltEl-button type = " text " @ click = " open " & gt；单击打开消息框
& lt/template & gt；
& lt脚本& gt
？导出默认值{
方法:{
？open() {
这个。$alert('这是一个段落'，'标题名'，{
？ConfirmButtonText:'确定'，
？回调:action = & gt{
这个。$message({
？类型:“信息”，
？消息:`操作:＄{ action } '
});
？}
});
？}
}
？}
& lt/script & gt；
```
弹出确认消息
```
？单击以打开消息框exportdefault {methods: {？Open2() {this。$confirm('此操作将永久删除文件，是否继续？'、' prompt '、{confirmButtonText:' OK '，cancelButtonText:' Cancel '，type:'warning'})。然后(()= & gt{这个。$ message ({type:'成功'，消息:'成功删除！'});}).catch(()= & gt；{这个。$ message ({type:' info '，message:' deleted ' })；？});？} }?}
& lt模板& gt
？& ltEl-button type = " text " @ click = " open 2 " & gt；单击打开消息框
& lt/template & gt；
& lt脚本& gt
？导出默认值{
方法:{
？open2() {
这个。$confirm('此操作将永久删除文件，是否继续？'，'提示'，{
？ConfirmButtonText:'确定'，
？CancelButtonText:'取消'，
？类型:“警告”
}).然后(()= & gt{
？这个。$message({
类型:“成功”，
消息:“删除成功！”
？});
}).catch(()= & gt；{
？这个。$message({
类型:“信息”，
消息:“删除已取消”
？});？
});
？}
}
？}
& lt/script & gt；
```
提交内容项目符号框
```
？单击以打开消息框exportdefault {methods: {？Open3() {this。$prompt('请输入电子邮件'，' prompt '，{confirmButtonText:' OK '，cancelButtonText:' Cancel '，inputPattern:/[\w！# $ % & amp'*+/=?^_`{|}~-]+(?:\.【\w！# $ % & amp'*+/=?^_`{|}~-]+)*@(?:[\w](？:[\w-]*[\w])？\.)+[\w](？:[\w-]*[\w])？/，inputErrorMessage:“邮箱格式不正确”})。然后(({ value })= & gt；{这个。$ message ({type:' success '，message:'您的电子邮件地址是:'+value？});}).catch(()= & gt；{这个。$ message ({type:' info '，message:'取消输入' })；？});？} }?}
& lt模板& gt
？& ltEl-button type = " text " @ click = " open 3 " & gt；单击打开消息框
& lt/template & gt；
& lt脚本& gt
？导出默认值{
方法:{
？open3() {
这个。$prompt('请输入电子邮件'，' prompt '，{
？ConfirmButtonText:'确定'，
？CancelButtonText:'取消'，
？inputPattern: /[\w！# $ % & amp'*+/=?^_`{|}~-]+(?:\.【\w！# $ % & amp'*+/=?^_`{|}~-]+)*@(?:[\w](？:[\w-]*[\w])？\.)+[\w](？:[\w-]*[\w])？/,
？InputErrorMessage:“不正确的邮箱格式”
}).然后(({ value })= & gt；{
？这个。$message({
类型:“成功”，
消息:'您的电子邮件地址是:'+value。
？});
}).catch(()= & gt；{
？这个。$message({
类型:“信息”，
消息:“取消输入”
？});？
});
？}
}
？}
& lt/script & gt；
```
自定义项目符号框
```
？单击以打开消息框exportdefault {methods: {？open4() {consth =this。$ createElement这个。$msgbox({title:' message '，message: h ('p '，null，[h ('span '，null，' content can ')，h ('i '，{style:' color: teal'}，' vnode ')？])，showcancelbutton: true，confirmbuttontext:' OK '，cancelButtonText:' Cancel '，关闭前:(action，instance，done)= > { if(action = = = ' confirm '){？instance . confirm button loading = true；？Instance.confirmButtonText = '正在运行...'；？setTimeout(()= & gt；{ done()；setTimeout(()= & gt；{ ?instance . confirm button loading = false；},300);？},3000);} else { done()；} ?} }).然后(action = & gt{这个。$message({ type:'info '，message:'action: '+ action？});});？} }?}
& lt模板& gt
？& ltEl-button type = " text " @ click = " open 4 " & gt；单击打开消息框
& lt/template & gt；
& lt脚本& gt
？导出默认值{
方法:{
？open4() {
const h = this。$ createElement
这个。$msgbox({
？标题:“消息”，
？消息:h('p '，null，[
H('span '，null，'内容可以')，
h('i '，{ style: 'color: teal' }，' VNode ')
？]),
？showCancelButton: true，
？ConfirmButtonText:'确定'，
？CancelButtonText:'取消'，
？beforeClose: (action，instance，done)= & gt；{
if (action === 'confirm') {
？instance . confirm button loading = true；
？Instance.confirmButtonText = '正在运行...'；
？setTimeout(()= & gt；{
done()；
setTimeout(()= & gt；{
？instance . confirm button loading = false；
}, 300);
？}, 3000);
}否则{
？done()；
}
？}
}).然后(action = & gt{
？这个。$message({
类型:“信息”，
消息: '操作:'+操作
？});
});
？}
}
？}
& lt/script & gt；
```
选项:
参数类型描述可选值默认值。
TitleMessageBox标题字符串-
MessageMessageBox消息正文内容字符串/vnode-
dangerouslyUseHTMLString是否将消息属性视为HTML片段布尔值—false？
类型消息类型，用于显示图标字符串成功/信息/警告/错误—
CustomClassMessageBox的自定义类名字符串-
回调如果不使用Promise，可以使用该参数指定MessageBox关闭后的回调函数(action，instance)。action的值是' confirm '或' cancel '，instance是一个MessageBox实例，通过它可以访问实例上的属性和方法。
showCloseMessageBox是否在右上角显示关闭按钮boolean-true？
关闭beforeCloseMessageBox前的回调会挂起实例的关闭函数(action，instance，done)，action的值为' confirm '或' cancel '；实例是一个MessageBox实例，通过它可以访问实例上的属性和方法；Done用于关闭MessageBox实例-
当消息框显示为布尔值时，lockScroll是否锁定正文滚动true。
showCancelButton是否显示取消按钮布尔值—false(由确认和提示调用时为true)
showConfirmButton是否显示确定按钮布尔值—真？
取消按钮字符串的文本—取消。
ConfirmButtonText确定按钮字符串的文本内容— OK。
自定义类别名称字符串——取消按钮类别取消按钮的
确定按钮的自定义类名字符串
closeOnClickModal是否可以通过单击掩码关闭messagebox boolean-true(在警报模式下调用时为false)。
closeOnPressEscape是否可以通过按ESC键关闭MessageBoxboolean—true(在警报模式下调用时为false)。
CloseOnhashchange是否关闭messagebox boolean—当hashchange时为true。
showInput是否显示输入框布尔值—false(在提示模式下调用时为true)
占位符字符串——输入占位符输入框的
输入类型输入文本框字符串-文本
输入值输入框的初始文本字符串-
检查输入模式输入框的表达式regexp
检查inputValidator输入框的功能。可以返回一个布尔值或者一个字符串，如果返回一个字符串，那么返回的结果将被赋给inputerrormessagefunction-
提示文本字符串—当inputErrorMessage验证失败时—输入数据不合法！
中心居中是否为布尔型false？
roundButton是否使用圆形按钮布尔值—false。