element ui this.$confirm
时间: 2023-05-08 07:56:34 浏览: 441
element中的$confirm的使用
5星 · 资源好评率100%
Element UI 是一套基于 Vue.js 的桌面端组件库,提供了丰富且易于使用的 UI 组件,其中包含了一个弹窗确认框的组件 this.$confirm。
使用 this.$confirm 可以快速创建一个弹窗确认框,通常用于用户需要进行某些敏感操作前的提示和确认。该组件需要传入一些选项参数,包括确认提示文字、确定按钮文字、取消按钮文字等等,同时还可以定义确认和取消后的回调函数。
在使用 this.$confirm 组件时,需要保证 Element UI 已经正确导入,并且在 Vue 实例(组件)中已经定义了该方法。常见用法如下:
```
import { Message, MessageBox } from 'element-ui'
export default {
methods: {
confirmAction() {
MessageBox.confirm('确定删除该记录吗?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 确认后的回调函数
Message.success('删除成功')
}).catch(() => {
// 取消后的回调函数
// do nothing
})
}
}
}
```
上面的代码中,我们使用了 Element UI 中的 MessageBox.confirm 方法来创建一个弹窗确认框,然后分别定义了确认和取消后的回调函数,最后在这些回调函数中执行相应的操作。
阅读全文