mirror of
https://github.com/youzan/vant.git
synced 2025-10-20 02:31:21 +00:00
z- to zan-
This commit is contained in:
@@ -3,33 +3,33 @@
|
||||
<h1 class="page-title">Popup</h1>
|
||||
|
||||
<h2 class="page-sub-title">基础用法</h2>
|
||||
<div class="z-button-1">
|
||||
<z-button @click="popupShow1 = true">从下方弹出popup</z-button>
|
||||
<div class="zan-button-1">
|
||||
<zan-button @click="popupShow1 = true">从下方弹出popup</zan-button>
|
||||
</div>
|
||||
<z-popup v-model="popupShow1" position="bottom" class="z-popup-1">
|
||||
<zan-popup v-model="popupShow1" position="bottom" class="zan-popup-1">
|
||||
xxxx
|
||||
</z-popup>
|
||||
</zan-popup>
|
||||
|
||||
<div class="z-button-1">
|
||||
<z-button @click="popupShow2 = true">从上方方弹出popup</z-button>
|
||||
<div class="zan-button-1">
|
||||
<zan-button @click="popupShow2 = true">从上方方弹出popup</zan-button>
|
||||
</div>
|
||||
<z-popup v-model="popupShow2" position="top" class="z-popup-2" :overlay="false">
|
||||
<zan-popup v-model="popupShow2" position="top" class="zan-popup-2" :overlay="false">
|
||||
更新成功
|
||||
</z-popup>
|
||||
</zan-popup>
|
||||
|
||||
<div class="z-button-1">
|
||||
<z-button @click="popupShow3 = true">从右方弹出popup</z-button>
|
||||
<div class="zan-button-1">
|
||||
<zan-button @click="popupShow3 = true">从右方弹出popup</zan-button>
|
||||
</div>
|
||||
<z-popup v-model="popupShow3" position="right" class="z-popup-3" :overlay="false">
|
||||
<z-button @click.native="popupShow3 = false">关闭 popup</z-button>
|
||||
</z-popup>
|
||||
<zan-popup v-model="popupShow3" position="right" class="zan-popup-3" :overlay="false">
|
||||
<zan-button @click.native="popupShow3 = false">关闭 popup</zan-button>
|
||||
</zan-popup>
|
||||
|
||||
<div class="z-button-1">
|
||||
<z-button @click="popupShow4 = true">从中间弹出popup</z-button>
|
||||
<div class="zan-button-1">
|
||||
<zan-button @click="popupShow4 = true">从中间弹出popup</zan-button>
|
||||
</div>
|
||||
<z-popup v-model="popupShow4" transition="popup-fade" class="z-popup-4">
|
||||
<zan-popup v-model="popupShow4" transition="popup-fade" class="zan-popup-4">
|
||||
一些内容
|
||||
</z-popup>
|
||||
</zan-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -57,12 +57,12 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.z-popup-1 {
|
||||
.zan-popup-1 {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.z-popup-2 {
|
||||
.zan-popup-2 {
|
||||
width: 100%;
|
||||
line-height: 44px;
|
||||
background-color: rgba(0, 0, 0, 0.701961);
|
||||
@@ -70,20 +70,20 @@ export default {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.z-popup-3 {
|
||||
.zan-popup-3 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.z-popup-4 {
|
||||
.zan-popup-4 {
|
||||
width: 50%;
|
||||
height: 200px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.page-popup .z-button-1 {
|
||||
.page-popup .zan-button-1 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user