开发小程序时,不可避免需要网络数据,就需要发起网络请求,可这就带来一个问题,因为网络请求是有延迟的,所以会造成:你已经使用一个变量了,可是这个变量的数据还没有返回来。
现象:在app.js中的onlaunch方法中发起网络请求,然后将返回的数据放到app的全局变量中,之后会在一个页面的onload方法中使用,出现的问题是,每次onload方法中获取到的这个变量一直为空,
解决办法:
第一种:使用回调函数:例子
app.js中:
wx.getUserInfo({
success: res => {// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) { //这里加入回调 ,注意:如果这个在另外的函数中嵌套,那么this变成that,最外层函数外写上 var that = this
this.userInfoReadyCallback(res)
}
}
})
onload页面:
if (app.globalData.userInfo) {
扫描二维码关注公众号,回复:
862687 查看本文章
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse){
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {// 注意:不可以写成app.userInfoReadyCallback(res){},会报错。
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
}
第二种:可以引入一个第三方变量 用来起标志作用,
如果判断app中现在返回的值为空(网络延迟),那么让第三方变量为true,然后在之后使用这个变量的时候再赋值,(相当于就是赋值的迟一点)