messageBox 弹框组件源码分享,主要从以下两个方面:
1、messageBox 组件页面结构。
2、messageBox 组件属性。
一、组件页面结构。
二、组件属性。
2.1 title 标题,类型为 string,无默认值。
2.2 message 消息正文内容,类型为 string / VNode,无默认值。
2.3 dangerouslyUseHTMLString,是否将 message 属性作为 HTML 片段处理,类型为 boolean,默认值 false。
2.4 type 消息类型,用于显示图标,类型为 string,可选值 success / info / warning / error,无默认值。
2.5 iconClass 自定义图标的类名,会覆盖 type,类型为 string,无默认值。
2.6 customClass 自定义类名,类型为 string,无默认值。
2.7 callback 若不使用 Promise,可以使用此参数指定 MessageBox 关闭后的回调,类型为 unction(action, instance),action 的值为'confirm', 'cancel'或'close', instance 为 MessageBox 实例,可以通过它访问实例上的属性和方法,无默认值。
2.8 showClose 是否显示右上角关闭按钮,类型为 boolean,默认值 true。
2.9 beforeClose 关闭前的回调,会暂停实例的关闭,类型为 function(action, instance, done),action 的值为'confirm', 'cancel'或'close';instance 为 MessageBox 实例,可以通过它访问实例上的属性和方法;done 用于关闭 MessageBox 实例,无默认值。
2.10 distinguishCancelAndClose 是否将取消(点击取消按钮)与关闭(点击关闭按钮或遮罩层、按下 ESC 键)进行区分,类型为 boolean,默认值 false。
2.11 lockScroll 是否在 MessageBox 出现时将 body 滚动锁定,类型为 boolean,默认值 true。
2.12 showCancelButton 是否显示取消按钮,类型为 boolean,默认值 false(以 confirm 和 prompt 方式调用时为 true)。
2.13 showConfirmButton 是否显示确定按钮,类型为 boolean,默认值 true。
2.14 cancelButtonText 取消按钮的文本内容,类型为 string,默认值取消。
2.15 confirmButtonText 确定按钮的文本内容,类型为 string,默认值确定。
2.16 cancelButtonClass 取消按钮的自定义类名,类型为 string,无默认值。
2.17 confirmButtonClass 确定按钮的自定义类名,类型为 string,无默认值。
2.18 closeOnClickModal 是否可以通过点击遮罩层关闭 messageBox,类型为 boolean,默认值true(以 alert 方式调用时为 false)。
2.19 closeOnPressEscape 是否可通过按下 ESC 键关闭 MessageBox,类型为 boolean,默认值true(以 alert 方式调用时为 false)。
2.20 closeOnHashChange 是否在 hashchange 时关闭 MessageBox,类型为 boolean,默认值 true。
2.21 showInput 是否显示输入框,类型为 boolean,默认值 false。
2.22 inputPlaceholder 输入框的占位符,类型为 string,无默认值。
2.23 inputType 输入框的类型,类型为 string,默认值 text。
2.24 inputValue 输入框的初始文本,类型为 string,无默认值。
2.25 inputPattern 输入框的校验表达式,类型为 regexp,无默认值。
2.26 inputValidator 输入框的校验函数。可以返回布尔值或字符串,若返回一个字符串, 则返回结果会被赋值给 inputErrorMessage,类型为 function,无默认值。
2.27 inputErrorMessage 未校验通过时的提示文本,类型为 string,默认值输入数据不合法!
2.28 center 是否居中布局,类型为 boolean,默认值 false。
2.29roundButton 是否使用圆角按钮,类型为 boolean,默认值 false。