海量编程文章、技术教程与实战案例

网站首页 > 技术文章 正文

Element UI组件替换Js confirm 方法

yimeika 2025-06-17 01:50:56 技术文章 8 ℃

在 Element UI 中,你可以使用 MessageBox 组件来创建弹出的确认框。 MessageBox 组件是 Element UI 提供的一个全局方法,用于显示各种对话框,包括确认框。

以下是一个示例代码,演示如何使用 MessageBox 组件创建一个确认框:

import { MessageBox } from 'element-ui';

// 在需要显示确认框的地方调用 MessageBox.confirm()
MessageBox.confirm('确认要执行此操作吗?', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  type: 'warning',
})
  .then(() => {
    // 用户点击了确定按钮
    // 执行相应的操作
  })
  .catch(() => {
    // 用户点击了取消按钮或关闭了对话框
    // 执行取消操作或不执行任何操作
  });

在上述代码中,我们调用了 MessageBox.confirm() 方法来创建一个确认框。该方法接受三个参数:

  1. message:确认框中显示的文本消息。
  2. title:确认框的标题。
  3. options:可选的配置对象,用于指定确认框的其他选项,如确认按钮和取消按钮的文本、对话框的类型等。

在确认框中,用户可以点击确认按钮执行相应的操作,或者点击取消按钮或关闭对话框来取消操作。

请确保已经正确安装和引入 Element UI 库,并根据你的实际需求调整确认框的文本、标题和配置选项。

最近发表
标签列表