微信小程序开发踩坑记录

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
		})		

	}
}

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值