mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-28 20:36:37 +08:00
90 lines
2.2 KiB
Plaintext
90 lines
2.2 KiB
Plaintext
<doc-page title="POPUP">
|
|
<view class="zan-btns" style="margin-top: 10vh;">
|
|
<button class="zan-btn" bindtap="togglePopup">
|
|
弹出popup
|
|
</button>
|
|
<button class="zan-btn" bindtap="toggleTopPopup">
|
|
从顶部弹出popup
|
|
</button>
|
|
<button class="zan-btn" bindtap="toggleBottomPopup">
|
|
从底部弹出popup
|
|
</button>
|
|
<button class="zan-btn" bindtap="toggleLeftPopup">
|
|
从左边弹出popup
|
|
</button>
|
|
<button class="zan-btn" bindtap="toggleRightPopup">
|
|
从右边弹出popup
|
|
</button>
|
|
</view>
|
|
|
|
<!-- 中间弹出框 -->
|
|
<zan-popup
|
|
show="{{ showPopup }}"
|
|
bindclose="togglePopup"
|
|
>
|
|
<view class="pop-example__container">
|
|
<view class="zan-btns">
|
|
<button class="zan-btn" bindtap="togglePopup">
|
|
关闭 popup
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</zan-popup>
|
|
|
|
<!-- 左侧弹出框 -->
|
|
<zan-popup
|
|
show="{{ showLeftPopup }}"
|
|
type="left"
|
|
bindclose="toggleLeftPopup"
|
|
>
|
|
<view class="pop-example__container pop-example__container--left">
|
|
<view class="zan-btns">
|
|
<button class="zan-btn" bindtap="toggleLeftPopup">
|
|
关闭 popup
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</zan-popup>
|
|
|
|
<!-- 右侧弹出框 -->
|
|
<zan-popup
|
|
show="{{ showRightPopup }}"
|
|
type="right"
|
|
bindclose="toggleRightPopup"
|
|
>
|
|
<view class="pop-example__container pop-example__container--right">
|
|
<view class="zan-btns">
|
|
<button class="zan-btn" catchtap="toggleRightPopup">
|
|
关闭 popup
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</zan-popup>
|
|
|
|
<!-- 顶部弹出框 -->
|
|
<zan-popup
|
|
show="{{ showTopPopup }}"
|
|
overlay="{{ false }}"
|
|
type="top"
|
|
bindclose="toggleTopPopup"
|
|
>
|
|
<view class="pop-example--top">内容</view>
|
|
</zan-popup>
|
|
|
|
<!-- 底部弹出框 -->
|
|
<zan-popup
|
|
show="{{ showBottomPopup }}"
|
|
type="bottom"
|
|
bindclose="toggleBottomPopup"
|
|
>
|
|
<view class="pop-example__container pop-example__container--bottom">
|
|
<view class="zan-btns">
|
|
<button class="zan-btn" catchtap="toggleBottomPopup">
|
|
关闭 popup
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</zan-popup>
|
|
|
|
</doc-page>
|