Element UI中嵌套Dialog的时候,嵌套的Dialog被遮挡

2025-06-11 14:33:54  阅读 12 次 评论 0 条

正常情况下是不建议嵌套使用Dialog的,如果要在页面同时显示多个Dialog,可以将他们平级放置,不过如果确实需要的话也是可以使用 append-to-body 这个属性~

出现这个情况是嵌套内层的dialog没有使用 append-to-body 这个属性

image.png

<template>
    <el-dialog title="保证金余额流水" :close-on-click-modal="false" :visible.sync="pageSetting.visible"
        class="el-upload-list el-upload-list--picture-card" >
        <span>{{pageData.userId}}</span>
    </el-dialog>
</template>
<script>

在被嵌套的dialog中添加  append-to-body 属性就可以啦,像酱紫

<template>
    <el-dialog title="保证金余额流水" :close-on-click-modal="false" :visible.sync="pageSetting.visible"
        class="el-upload-list el-upload-list--picture-card" append-to-body>
        <span>{{pageData.userId}}</span>
    </el-dialog>
</template>

问题完美解决~~

image.png


微信扫码查看本文
本文地址:https://www.yangguangdream.com/?id=2255
版权声明:本文为原创文章,版权归 编辑君 所有,欢迎分享本文,转载请保留出处!
NEXT:已经是最新一篇了

发表评论


表情

还没有留言,还不快点抢沙发?