«

ElmentUI 设置禁止点击遮罩关闭 el-dialog 弹窗

emer 发布于 2021-4-27 10:40   1684 次阅读     


el-dialog 弹窗初始化默认点击弹窗组件以外区域(遮罩)会导致该组件关闭



方法一:(局部控制)



修改 close-on-click-modal 属性改为 false 可以禁止点击遮罩关闭弹窗(默认是true)



注:在使用 close-on-click-modal 属性时,必须在该属性前加冒号 " : "



方法二:(局部控制)



添加 before-close 属性,在 dialog 关闭时,让用户进行确认是否需要关闭



handleClose(done) {

    this.$confirm('确认关闭?').then( => {

        done();

    }).catch(
=> {});

}

方法三:(全局配置)



mian.js 文件里面:



import ElementUI from 'element-ui';

// 修改 el-dialog 默认点击遮照不关闭

ElementUI.Dialog.props.closeOnClickModal.default = false;