在某些场景下,我们可能需要区分点击取消按钮关闭 messageBox 和点击X号、遮罩层关闭 messageBox 。
实现:
将 distinguishCancelAndClose 设置为 true,这个属性的意思是:是否将取消(点击取消按钮)与关闭(点击关闭按钮或遮罩层、按下 ESC 键)进行区分,默认为false。
然后就可以在 .catch()中通过 action 参数来进行区分不同的关闭方式
this.$confirm('是否确认操作?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',distinguishCancelAndClose: true
}).then(() => {// 点击了确定按钮console.log('点击了确定按钮');
}).catch((action) => {if (action === 'cancel') {// 点击了取消按钮console.log('点击了取消按钮');} else if (action === 'close') {// 点击了右上角的x按钮或遮罩层console.log('点击了右上角的x按钮或遮罩层');}
});