vue引用vant组件库,一个页面同时绑定多个popup弹框
<div class="item mt30"><div class="name">配送方式</div><div class="right"><strong>邮寄</strong><van-icon name="ellipsis" @click="showPopup"/>...
·
1、h5
<div class="item mt30">
<div class="name">配送方式</div>
<div class="right">
<strong>邮寄</strong>
<van-icon name="ellipsis" @click="showPopup"/>
</div>
</div>
<div class="item mt30">
<div class="name">发票</div>
<div class="right">
<strong>电子普通发票/个人</strong>
<van-icon name="ellipsis" @click="showPopup2"/>
</div>
</div>
<!--配送方式_弹框-->
<van-popup
v-model="showPS"
closeable
round
position="bottom"
:style="{ height: '70%' }">
<div class="invoice_wrap">
内容1
</div>
</van-popup>
<!--发票_弹框-->
<van-popup
v-model="showFP"
closeable
round
position="bottom"
:style="{ height: '70%' }">
<div class="invoice_wrap">
内容2
</div>
</van-popup>
2、js:
import Vue from 'vue';
import {Popup} from 'vant';
Vue.use(Popup);
methods: {
//弹框 tangyk
showPopup() {
this.showPS = true;
},
showPopup2() {
this.showFP = true;
},
},
data() {
return {
//配送和发票弹框 tangyk
showPS: false,
showFP: false,
};
}
更多推荐
已为社区贡献2条内容
所有评论(0)