A problem with element-UI was that the dialog that popped up was supposed to be on top of the translucent mask, but somehow slipped underneath and was obscured.

After checking some data, we know that if the position value of the outer layout of the Dialog is fixed, Absolute and relative, it will be covered by the mask.

The solution is simple: check Element’s official documentation

:modal-append-to-body='false'Or: append - to - body ='true'
Copy the code

The following code

<el-dialog
    title="Login"
    :visible.sync="dialogVisible"
    top="20vh"
    width="30%"
    :append-to-body="true">
</el-dialog>
Copy the code

The original address