【Vue】给 elementUI 中的 this.$confirm、this.$alert、 this.$prompt添加按钮的加载效果

在Vue中使用Element UI库时，this.$confirm、this.$alert和this.$prompt方法可以用来创建确认框、提示框和输入框。若要为这些对话框添加按钮，可以通过传递一个对象作为参数，该对象包含按钮的配置。

以下是一个例子，展示如何为this.$confirm添加自定义按钮：

this.$confirm('这是一段内容，确认继续吗？', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  type: 'warning'
}).then(() => {
  // 确认操作
  this.$message({
    type: 'success',
    message: '确认!'
  });
}).catch(() => {
  // 取消操作
  this.$message({
    type: 'info',
    message: '取消操作'
  });  
});

对于this.$alert和this.$prompt，添加按钮的方式类似：

// 对于 this.$alert
this.$alert('这是一段内容', '标题', {
  confirmButtonText: '确定',
  callback: action => {
    this.$message({
      type: 'info',
      message: `选择了: ${action}`
    });
  }
});
 
// 对于 this.$prompt
this.$prompt('请输入内容', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  inputPattern: /^[0-9]*$/,
  inputErrorMessage: '只能输入数字'
}).then(({ value }) => {
  // 确认操作
  this.$message({
    type: 'success',
    message: '确认: ' + value
  });
}).catch(() => {
  // 取消操作
  this.$message({
    type: 'info',
    message: '取消操作'
  });  
});

以上代码中，按钮的文本可以自定义，并且可以通过回调函数处理按钮被点击后的行为。