如何解决一个van-popup调起另一个van-popup

情况是这样的我的一个页面中有两个van-popup当一个popup调起时会导致另外一个popup也吊起来。此时发现两个popup绑定的v-model的值是不一样的。打印两个v-model绑定的值也都正常。

// 两个van-popup
    <van-popup v-model="show" round position="bottom">
      <van-picker
        ...
      />
    </van-popup>
    <van-popup
      v-model="confirmShow"
      position="bottom"
      :style="[{ height: '90%' }, { width: '100%', display: 'flex' }]"
    >
      <BillComfirmPop />
    </van-popup>

如何解决？

方法一：

动态控制popup的高度 代码如下

    <van-popup
      v-model="confirmShow"
      ...
      :style="[
        confirmShow ? { height: '90%' } : { height: '0%' }, // 就是这行代码啦
        { width: '100%', display: 'flex' },
      ]"
    >
      <BillComfirmPop v-if="confirmShow" />
    </van-popup>

方法二：

v-if="show" 与 v-model="show"同步进行

    <van-popup
      v-model="confirmShow"
      v-if="confirmShow"   // 加这一行代码就阔以啦 已 v-model的值同步。
      overlay
      round
      position="bottom"
      :style="[{ height: '90%' }, { width: '100%', display: 'flex' }]"
    >
      <BillComfirmPop/>
    </van-popup>