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,
    };
}

 

 

Logo

前往低代码交流专区

更多推荐