【省流: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的文档