vue 弹出框确认

如果需要在弹出框中添加确认按钮，可以使用ElementUI提供的MessageBox弹出框组件。具体步骤如下：

1. 安装ElementUI并引入MessageBox组件：

npm install element-ui --save

import { MessageBox } from 'element-ui';

2. 在Vue组件中使用MessageBox组件：

<template>
  <div>
    <button @click="showDialog">打开弹出框</button>
    <el-dialog :visible.sync="dialogVisible" title="弹出框标题">
      <p>这里是弹出框内容</p>
      <div slot="footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

export default {
  data() {
    return {
      dialogVisible: false
    };
  },
  methods: {
    showDialog() {
      this.dialogVisible = true;
    },
    confirm() {
      MessageBox.confirm('确定执行此操作吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 确认操作
        this.dialogVisible = false;
      }).catch(() => {
        // 取消操作
      });
    }
  },
  components: {
    'el-dialog': Dialog
  }
};

其中，`MessageBox`组件的`confirm`方法用于显示一个带有确认和取消按钮的弹出框，点击确认按钮后执行`then`方法中的代码，点击取消按钮后执行`catch`方法中的代码。