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>