MessageBox: add inputValue (#2909)

pull/2961/head
杨奕 2017-02-22 15:15:16 +08:00 committed by baiyaaaaa
parent f2fc8b5fb6
commit c4367604ab
4 changed files with 14 additions and 5 deletions

View File

@ -284,9 +284,10 @@ The corresponding methods are: `MessageBox`, `MessageBox.alert`, `MessageBox.con
| cancelButtonClass | custom class name of cancel button | string | — | — |
| confirmButtonClass | custom class name of confirm button | string | — | — |
| closeOnClickModal | whether MessageBox can be closed by clicking the mask | boolean | — | true (false when called with alert) |
| closeOnPressEscape | whether MessageBox can be closed by pressing the ESC | boolean | — | false |
| closeOnPressEscape | whether MessageBox can be closed by pressing the ESC | boolean | — | true (false when called with alert) |
| showInput | whether to show an input | boolean | — | false (true when called with prompt) |
| inputPlaceholder | placeholder of input | string | — | — |
| inputValue | initial value of input | string | — | — |
| inputPattern | regexp for the input | regexp | — | — |
| inputValidator | validation function for the input. Should returns a boolean or string. If a string is returned, it will be assigned to inputErrorMessage | function | — | — |
| inputErrorMessage | error message when validation fails | string | — | Illegal input |

View File

@ -281,9 +281,10 @@ import { MessageBox } from 'element-ui';
| cancelButtonClass | 取消按钮的自定义类名 | string | — | — |
| confirmButtonClass | 确定按钮的自定义类名 | string | — | — |
| closeOnClickModal | 是否可通过点击遮罩关闭 MessageBox | boolean | — | true以 alert 方式调用时为 false |
| closeOnPressEscape | 是否可通过按下 ESC 键关闭 MessageBox | boolean | — | false |
| closeOnPressEscape | 是否可通过按下 ESC 键关闭 MessageBox | boolean | — | true以 alert 方式调用时为 false |
| showInput | 是否显示输入框 | boolean | — | false以 prompt 方式调用时为 true|
| inputPlaceholder | 输入框的占位符 | string | — | — |
| inputValue | 输入框的初始文本 | string | — | — |
| inputPattern | 输入框的校验表达式 | regexp | — | — |
| inputValidator | 输入框的校验函数。可以返回布尔值或字符串,若返回一个字符串, 则返回结果会被赋值给 inputErrorMessage | function | — | — |
| inputErrorMessage | 校验未通过时的提示文本 | string | — | 输入的数据不合法! |

View File

@ -7,6 +7,7 @@ const defaults = {
modalFade: true,
lockScroll: true,
closeOnClickModal: true,
closeOnPressEscape: true,
inputValue: null,
inputPlaceholder: '',
inputPattern: null,
@ -75,6 +76,7 @@ const showNextMsg = () => {
if (!instance) {
initInstance();
}
instance.action = '';
if (!instance.value || instance.closeTimer) {
if (msgQueue.length > 0) {

View File

@ -174,9 +174,14 @@
},
watch: {
inputValue(val) {
if (this.$type === 'prompt' && val !== null) {
this.validate();
inputValue: {
immediate: true,
handler(val) {
this.$nextTick(_ => {
if (this.$type === 'prompt' && val !== null) {
this.validate();
}
});
}
},