Record a very speechless thing. When writing the Demo, all the dialog boxes used on the home page of the entire front-end module z-indexfailed. Became the following effect
The normally translucent black masking layer should be below the dialog box. Use the control view to find that the z-index of the dialog box and the masking layer are different every time, and the masking layer is always on top. Very speechless, I used git to check between different versions. Although I found the file that triggered this problem, I couldn’t find the specific line of code after deleting and checking. I changed the file name of a custom css in the middle and it was restored for a short time. , It reappeared after several versions, so the actual cause of the specific occurrence has not been located. But fortunately, I finally found a solution, that is, to insert both the specified dialog box and the masking layer into the body, and that's it.
Just el-dialogadd in the tagmodal-append-to-body="true" append-to-body="true"