ElMessageBox.prompt
时间: 2023-10-29 17:00:43 浏览: 122
MessageBox
ElMessageBox.prompt 是 ElementUI 中的一个组件,用于显示一个带有输入框的提示框,让用户可以输入内容。
要使用 ElMessageBox.prompt 组件,你需要先导入 ElementUI,并在 Vue 组件中引入该组件。然后,你可以通过调用 `$prompt` 方法来创建一个提示框。
以下是一个示例:
```html
<template>
<div>
<el-button @click="showPrompt">显示提示框</el-button>
</div>
</template>
<script>
export default {
methods: {
showPrompt() {
this.$prompt('请输入内容', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputPattern: /\S/,
inputErrorMessage: '请输入内容'
}).then(({ value }) => {
// 用户点击确定后的回调函数
console.log(value);
}).catch(() => {
// 用户点击取消后的回调函数
console.log('取消');
});
}
}
}
</script>
```
在上面的示例中,当用户点击按钮时,会弹出一个带有输入框的提示框。用户可以输入内容,并点击确定按钮或取消按钮。如果用户点击确定按钮,则会执行 `.then` 中的回调函数,并且可以通过参数获取用户输入的内容。如果用户点击取消按钮,则会执行 `.catch` 中的回调函数。
注意:上述示例中的代码是基于 Vue 和 ElementUI 的,如果你没有使用这些库,请适当调整代码。
阅读全文