文章目录
1. 给组件的data赋值
如图:
2.本地存储wx.getStorageSync和wx.setStorageSync的坑
使用微信小程序本地存储,开发者工具里可以存number,真机上就变成String了,如果要从本地存储里面取值,要取Number的话要paseInt()强转一下
3.微信小程序对data{}的监听机制
微信小程序只能监听data下属性的值的变化,不能监听data的属性的属性的变化
data:{
a:10, //当a的值改变时,能监听到,页面绑定的数据也会跟着变化
b:100,
c:{"d":5,"e":55} //当c.e的值改变时,不能监听到,只能监听到c的地址
//值变化,不能监听到c的属性的变化,页面若绑定了{{c.d}}这个值,
//c.d变化时,页面渲染不了
}
如果直接用setData()给 c.d 修改或复制,会失败
this.setData({
c.d:50 //修改不了!
})
但是可以通过这种方式来给data里的对象赋值或修改值:
let cd = "c.d"
this.setData({
[cd]:50 //能修改成功!
})
类似的直接这样也行
this.setData({
["c.d"]:50 //能修改成功!
})
4.给组件的properties传参时,properties一定要指定数据类型,否则真机测试会报错!!!
如:
properties: {
baseUrl:String,
para:String,
index:Number
}
5 报错Do not have xxx handler in current page,xxxx
重启开发者工具就好
6 微信小程序异步转同步
这就要async、await和promise配合使用了
比如使用组件时,微信小程序的双向绑定不能深层监听(在第3个坑有讲),我要在组件attached之前把数据赋值给组件的data,而wx.request是异步请求,很有可能数据还没响应回来,页面就attached完了,这样页面双向绑定了data的属性的深层属性就不能监听到这个深层属性的值,
(使用page同理)
如果直接用wx.request获取a的数据,则下面的view显示不出来,因为微信小程序的双向绑定不能监听到深层属性,所以要使用同步请求,在组件attached完成之前把a的值附上
<!-- 如果a.b变了,wx:if不能监听到!其他双向绑定wx:for等等都是! -->
<view wx:if="{{a.b == 1}}">666</view>
data:{
a:{
b:0
}
},
lifetimes: {
async attached(){
let res = await new Promise((resolve, reject) => {
wx.request({
url:'xxx',
method:'GET',
success:(res)=>{
resolve(res); //把wx.request的res通过promise的resolve()返回
},
fail:(err)=>{
reject(err); //把wx.request的fail的err通过promise的reject()返回
}
})
})
//根据请求返回的数据给data赋值和做其他操作
this.setData({
a:res.data.data.a //假如返回的a.b的值是1
})
}
}