elementui确认消息区分取消和关闭按钮

默认情况下，elementui的确认消息，取消按钮和右上角弹窗，走的是同一个方法，也就是catch方法的回调，如果功能上需要做区分，就没法区分了。

所以，要解决这个问题，就需要在取消的回调方法里做一个判断，来区分是点击右上角的取消，还是点击的取消按钮。

代码如下：

this.$confirm('请选择审核意见', '提示', {confirmButtonText: '通过',cancelButtonText: '驳回',type: 'warning',center: true,closeOnPressEscape:false,//按下 ESC 键关闭弹窗closeOnClickModal:false,//点击遮罩关闭弹窗distinguishCancelAndClose:true,//区分取消与关闭}).then(() => {//确认回调}).catch((action) => {//取消按钮及右上角的关闭按钮回调//在catch方法的回调参数中传递action，判断action的值为 cancel 还是 close，如果是close，就代表操作为点击右上角按钮，为 cancel，就是点击的取消按钮if (action === 'cancel') {//驳回} else {//关闭弹窗return;}});

elementui确认消息区分取消和关闭按钮相关推荐

MessageBox 弹框消息提示、确认消息
type 消息类型,用于显示图标 success / info / warning / error 1.消息提示 this.$alert('这是一段内容', '标题名称', {confirmButto ...
vue解决element-ui popover点击取消时 popover的显示与隐藏问题
最近在项目中使用 elementui 中的table组件popover进行开发,官网的案例如果使用数据遍历,操作列使用 <template></template> 做插槽的话 ...
老的消息中间件投递失败的类型值_RabbitMQ消息中间件技术精讲11 高级篇四 confirm 确认消息...
RabbitMQ消息中间件技术精讲11 高级篇四 confirm 确认消息理解Confirm消息确认机制: 消息的确认,是指生产者投递消息后,如果broker收到消息,则会给生产者一个应答: 生产者 ...
计算机报名成功后还可以取消吗,【造价工程师报名信息确认后可以取消吗？如何取消？】- 环球网校...
[摘要]2017年造价工程师考试报名预计从7月开始,许多小伙伴还对造价工程师报名时遇到的一些问题存在疑问,比如造价工程师报名信息确认后可以取消吗?如何取消?以下是小编给各位整理的答案. 问:造价工程师 ...
修改vant 弹窗Dialog组件调用是确认按钮与取消按钮的文字
文章目录修改vant 弹窗Dialog组件调用是确认按钮与取消按钮的文字效果图 · 示例: 重要代码如下(部分): 代码使用 · 注意事项: 官方文档参数定义 · 注意事项: 文章阅读: 修改va ...
如何调换antd中Modal对话框确认按钮和取消按钮两个按钮的位置
今天有个工作是把所有的确认按钮放在取消按钮的左边,类似于下图这样的,公司用的时antd组件但是antd组件的按钮时确认键放在右边的可以采用下面的方式,将按钮调换过来: 对的,就是在modal里面的 ...
Net中使用 RabbitMq | Confirm确认消息
RabbitMQ 消息确认机制 - 消费者确认由于生产者和消费者不直接通信,生产者只负责把消息发送到队列,消费者只负责从队列获取消息(不管是push还是pull). 消息被"消费&quo ...
标题Ant Design of Vue 组件库中Modal“确认“按钮和“取消“按钮成英文状态
标题Ant Design of Vue 组件库中Modal"确认"按钮和"取消"按钮成英文状态因为是国际化的原因,造成确定按钮和取消按钮变成英文,需要设置 o ...
ElementUI的消息提示框及确认框
前提:在使用以下功能时,都需要引入/导入ElementUI 第一种:消息提示框包含:成功 / 警告 / 信息 / 错误四种类型官方地址:Element - The ...

elementui确认消息区分取消和关闭按钮

elementui确认消息区分取消和关闭按钮相关推荐

最新文章

热门文章