vue ElMessageBox 设置点击空白不关闭

要阻止Element UI Dialog和MessageBox在点击空白区域时自动关闭，你可以采取以下步骤：

1. **单个对话框禁用**:
对于特定的Dialog或MessageBox实例，可以使用`show()`方法的回调参数来阻止默认行为。例如，在显示对话框时，添加一个事件监听器并防止其默认的行为：

   this.$el MessageBox({
     title: '标题',
     message: '消息内容',
     onShow: function() {
       document.addEventListener('click', function(event) {
         if (event.target !== this.$el && !this.$el.contains(event.target)) {
           event.preventDefault(); // 阻止默认的关闭行为
         }
       }.bind(this), {passive: false});
     },
     onClose: function() {
       // 清除事件监听器，当对话框关闭时
       document.removeEventListener('click', this.onclickHandler);
     },
   });

2. **全局设置（仅适用于版本 >= 2.13.0）**:
如果你想在整个应用中禁用这个功能，从Element UI 2.13.0开始，有一个全局配置选项可以控制。设置`globalConfig`来阻止关闭：

   import Vue from 'vue';
   import ElementUI from 'element-ui';

   const app = new Vue({
     el: '#app',
     components: { ElementUI },
     data() {
       return {
         globalConfig: {
           ...ElementUI.default.globalConfig,
           closeOnPressEscape: false, // 或者 closeOnClickModal: false
         },
       };
     },
     mounted() {
       ElementUI.use(ElementUI, { globalConfig: this.globalConfig });
     },
   });

注意：`closeOnPressEscape` 控制的是按Esc关闭，而 `closeOnClickModal` 控制的是点击模态框外部关闭。