element-UI el-dialog组件按ESC键关闭不了弹窗
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
·
我的代码
<el-dialog :visible.sync="isShow" :modal="false"></el-dialog>
点击“Esc”按键无法关闭弹窗,然后在官方例子中是可以按Esc关闭弹窗,
去查看官方文档,如下:

close-on-press-escape默认为“true” ,百思不得其解
之后代码改为:
<el-dialog :visible.sync="isShow" :modal="false" append-to-body></el-dialog>
| append-to-body | Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true |
然后检查全局是否设置禁止 Esc关闭弹窗的代码即如下代码:
import Vue from 'vue';
import ElementUI from 'element-ui';
// 全局修改默认配置,点击空白处不能关闭弹窗
ElementUI.Dialog.props.closeOnClickModal.default = false;
// 全局修改默认配置,按下ESC不能关闭弹窗
ElementUI.Dialog.props.closeOnPressEscape.default = false;
Vue.use(ElementUI);
经查找也没有该设置
后来把 :modal=“false” 去掉,按Esc可以关闭弹窗了,猝不及防............
拓展: 修改遮罩层颜色
.v-modal{ background-color: transparent; }
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
1 年前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 1 年前
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐



所有评论(0)