vue中解决上个路由的el-dialog遮罩层未关闭问题
1. 问题描述
开发vue2项目的时候,遇到一个路由页面打开弹窗的情况下跳转到另一个路由后,上一个路由页面的弹窗遮罩层还在。
2. 问题截图
- 打开弹窗的路由1
- 点击 详情 页面后打开新的路由2
3. 解决方法
文档中属性modal-append-to-body
设置为false,将遮罩层插入至 Dialog 的父元素上
。
4. 部分代码
<el-dialog
title="XXX详情"
:close-on-click-modal="false"
:modal-append-to-body="false"
:visible.sync="visible"
@close="close"
></el-dialog>