问题1:打开弹窗时,弹窗被遮罩层遮挡
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/432b562c4fc8646f9199482250f9450e.png)
原因:可以看到,该遮罩层覆盖在APP组件之上,我们要做的是,将遮罩层只针对于自己的父组件上
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/8485f98db7c0b9e470fd4506353cf750.png)
解决方法:在对话框中增加:modal-append-to-body='false'
该属性
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/6c5fc847eea5924595f127b3462e05f3.png)
具体可以查看elementui官方文档
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/41d71ff6acbcb99cb92572cde72a7eae.png)
问题2:在对话框中使用MessageBox 弹框,关闭后,遮罩层不消失
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/49a4f0990b859573e76162d021c29b96.png)
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/be730ba04c24e1f5d80b22d5f549b081.png)
原因:可以发现,原因也和上面差不多,将嵌套的那个弹窗加到body上
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/6b5c14f1e5839bef0d402966afd43829.png)
解决方法:在对话框中增加append-to-body
该属性
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/73d59c0a9b93a8bbbcfbbbf00f5e9305.png)
具体可以查看elementui官方文档
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/37af09e111f9293902fcabfb7f98f931.png)