element-ui的confirm和alert弹窗在Safari浏览器看不见的bug及其简单解决

问题描述：

近期遇见一个问题，element-ui的$confirm弹窗后执行确认后$alert弹窗。

在Chrome正常，但是在Safari则会出现闪现一下alert弹窗，然后只剩下灰色的蒙板，且点击关不掉的问题。

问题代码：

  
  
  


  

    Button
    
      
Try Element
    
  

  
  
  
  
  

分析：

如上，$confirm确认弹窗后执行$alert弹窗。Safari只剩下蒙板，但是dom还在。点击隐藏的弹窗位置依旧可以关掉弹窗。。。。

如图dom还在，但是不显示，外层的.el-message-box__wrapper选择右侧元素样式取消或关闭fixed会显示，如下：

 估计是element-ui和Safari这边的bug。

出现类似的Safari或者element-ui的问题此可做参考。。。

解决方案：

1.改$alert弹窗为$message的提示方式。。。。。。

2.用setTimeout执行延长$alert的时间，且延迟1s以上（1s仅做参考）。。。。。

期待有更好的方案。。。。