El-dialog is not allowed to be closed when it is clicked blank, it can only disappear when the close and cancel buttons are clicked

scenes to be used

When using the Dialog component, when clicking on the blank space outside the pop-up frame, the event of closing the pop-up frame will still be triggered. Some business scenarios are not suitable for this kind of interaction, and only the close and cancel buttons need to be clicked to disappear.

method one

// close-on-click-modal	是否可以通过点击 modal 关闭 Dialog
  // close-on-press-escape	是否可以通过按下 ESC 关闭 Dialog
  <el-dialog
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      v-if="businessReview"
      :visible.sync="businessReview"
      title="业务"
      top="25vh"
      width="320px"
      class="business-review-dialog">
  </el-dialog>

 Method Two

	// main.js 中可以全局设置 点击空白处、按下ESC不能关闭Dialog弹窗
	// 首先你得保证在main.js里面引入了 element-ui
	import ElementUI from 'element-ui'
	
	// 全局修改默认配置,点击空白处不能关闭弹窗
	ElementUI.Dialog.props.closeOnClickModal.default = false
	// 全局修改默认配置,按下ESC不能关闭弹窗
	ElementUI.Dialog.props.closeOnPressEscape.default = false
	
	Vue.use(ElementUI)

Guess you like

Origin blog.csdn.net/weixin_69811594/article/details/129624829