el-dialog设置点击空白处不自动关闭
要阻止 <el-dialog> 在点击空白处时自动关闭，可以使用 :close-on-click-modal="false" 属性。
<template>
<div>
<el-dialog
:visible="dialogVisible"
:close-on-click-modal="false"
@close="closeDialog"
>
<!-- 对话框内容 -->
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false
};
},
methods: {
showDialog() {
this.dialogVisible = true;
},
closeDialog() {
this.dialogVisible = false;
}
}
};
</script>
在上述示例中，我们通过将 :close-on-click-modal="false" 应用于 <el-dialog> 组件来禁止点击空白处时自动关闭对话框。这样，无论用户点击对话框外的区域，对话框都不会关闭。
你可以根据你的实际情况修改示例代码中的其他部分。dialogVisible 数据属性用于控制对话框的显示与隐藏，showDialog 方法用于打开对话框，closeDialog 方法用于关闭对话框。
请注意，除了点击空白处关闭对话框，用户还可以通过点击右上角的关闭按钮或按下 Esc 键来关闭对话框。如果你想禁止这些方式关闭对话框，可以进一步调整相关的属性和事件处理。
文章链接
https://www.cayzlh.com/post/20230719/
