2018-08-03 14:39:04 +08:00

55 lines
1.4 KiB
Plaintext

<demo-block title="基础用法" padding>
<van-button bind:tap="togglePopup">弹出 Popup</van-button>
<van-popup
show="{{ show.middle }}"
custom-class="center"
bind:close="togglePopup"
>
内容
</van-popup>
</demo-block>
<demo-block title="弹出位置" padding>
<van-button bind:tap="toggleBottomPopup" custom-class="demo-margin-right">底部弹出</van-button>
<van-popup
show="{{ show.bottom }}"
position="bottom"
custom-class="bottom"
bind:close="toggleBottomPopup"
>
内容
</van-popup>
<van-button bind:tap="toggleTopPopup" custom-class="demo-margin-right">顶部弹出</van-button>
<van-popup
show="{{ show.top }}"
position="top"
overlay="{{ false }}"
custom-class="top"
bind:close="toggleTopPopup"
>
内容
</van-popup>
<van-button bind:tap="toggleRightPopup">右侧弹出</van-button>
<van-popup
show="{{ show.right }}"
position="right"
custom-class="right"
bind:close="toggleRightPopup"
>
<van-button bind:tap="toggleRightPopup" custom-class="demo-margin-right">关闭弹层</van-button>
<van-button bind:tap="toggleRightPopup2">右侧弹出</van-button>
<van-popup
show="{{ show.right2 }}"
position="right"
custom-class="right"
bind:close="toggleRightPopup2"
>
<van-button bind:tap="toggleRightPopup2">关闭弹层</van-button>
</van-popup>
</van-popup>
</demo-block>