情况是这样的我的一个页面中有两个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>
