element-ui：el-dialog遮罩层变黑

常用的遮罩样式

/* 遮罩层 */
.mo-mask {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

el-dialog遮罩层使用的样式

.v-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    background: #000000;
}

问题可能出在opacity: 0.5; 可以使用 background-color: rgba(0, 0, 0, 0.5); 实现同样的效果

解决

将原有样式覆盖

.v-modal {
    background-color: rgba(0, 0, 0, 0.5);
}

参考 解决 el-dialog 封装内嵌多次调用 遮罩层样式失效，直接全黑