弹出位置
跟随元素对齐
弹窗圆角
遮罩层
自动隐藏
滚动穿透
测试弹层内滚动到顶部或底部时是否会影响主页面滚动
下滑关闭
提示: 当 close-on-slide-down=true 时,可下滑关闭容器
其他方向滑动关闭
提示: close-on-slide-down=true 时,关闭方向由 position 决定
多层堆叠测试
v-if="containerShow"
:show="containerShow" :position="containerPosition" :round="containerRound"
:overlay="containerOverlay" :overlay-style="containerOverlayStyle"
:custom-style="containerCustomStyle"
:close-on-slide-down="containerCloseOnSlideDown" @afterleave="onAfterLeave">
{{ containerTitle }}
{{ containerContent }}
{{ containerContent }}
第1层弹层
这是第1层弹层,点击下方按钮可以打开第2层
第2层弹层
这是第2层弹层,点击下方按钮可以打开第3层
第3层弹层
这是第3层弹层,最顶层的弹层
v-if="showAlignContainer"
:show="showAlignContainer" position="center" overlay-style="background-color: rgba(0, 0, 0, 0.1);"
:custom-style="alignContainerStyle"
@afterleave="closeAlignContainer">