修改el-dialog動畫導致在有threejs的頁面閃動的問題

修改el-dialog動畫代碼如下：

/* dialog框顯示和隱藏的動畫效果 改浮現方式從左往右出現 */
@keyframes dialog-fade-in {
  0% {
    transform: translate3d(-100%, 0, 0);
    opacity: 0;
  }
  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes dialog-fade-out {
  0% {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  100% {
    transform: translate3d(100%, 0, 0);
    opacity: 0;
  }
}

現象：

平時用着好好的，突然有一天，在3D場景中使用彈出框，出問題了，閃屏啊。
就是那種從左往右滑到中間突然閃現一下重新滑動。
這……

定位：

1、查看點擊事件只觸發了一次
2、並沒有觸發關閉事件
3、:visible.sync="dialogVisible"監控dialogVisible也就只變化了一次變成了true
費解……
4、那我關了動畫吧，註釋掉以上，誒，好了。
5、然後我就瘋狂找規律啥時候會出現閃屏呢，好像是threejs加載了很多動畫以後就會出現，如果僅僅加載場景沒有各種特效，彈出框是沒有閃屏的。
這好像也說得通，因爲threejs在不停渲染頁面，而彈出框動畫也有執行時間也在渲染界面，所以衝突了？
於是乎我修改彈出框的動畫時間：
.el-dialog__wrapper {
transition-duration: 3s;
}
果然出現了奇奇怪怪的現象，雖然也不能證明啥。

思考：

element-ui並未對外提供這個動畫控制，所以……我不知道了，反正就是衝突了。
註釋掉上述代碼就行了，和threejs連用的el-dialog還是用默認的動畫吧。
哎，記錄一下，求大神解答……