小程序网络请求延迟

开发小程序时,不可避免需要网络数据,就需要发起网络请求,可这就带来一个问题,因为网络请求是有延迟的,所以会造成:你已经使用一个变量了,可是这个变量的数据还没有返回来。

现象:在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) {

      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,然后在之后使用这个变量的时候再赋值,(相当于就是赋值的迟一点)

猜你喜欢

转载自blog.csdn.net/xuexixuexien/article/details/79809536