uni-app 开发微信小程序使用 vant popup时v-model无效

【省流:用:show而不是v-model。vant小程序版跟网页版的属性方法不同,要好好看文档

因为项目需要,目前在使用uni-app开发一个微信小程序,是将之前官网的部分功能转为小程序可用。

由于之前官网使用的是vant,所以也在uni-app上使用vant作为UI框架来开发。(Vue2)

在我使用到vant的popup的时候,问题出现了。

我用原先的代码,用一个show来控制popup组件的的显示与否,但是失败了。

<van-popup v-model="show">xxx</van-popup>

查了一下github和搜索了一下才发现,小程序上的vant用的是跟网页版的不一样的方法,网页版的可以使用v-model,但是小程序的要用"show"属性来控制显示与否。

<van-popup :show="show" @close="show=false" position="bottom">xxx</van-popup>

由于是用show属性来控制,所以需要写一个close方法,这样一来,点击遮罩层关闭的“close-on-click-overlay”属性也才其效果,跟vue那里的v-model一次控制不一样。

小程序端的vant和网页端的vant还是有一些区别的,大家在写的时候如果遇到跟网页端不同的情况,应该看看vant-weapp的文档

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值