微信小程序中Callback回调函数

Posted 2020-11-28 Wahaha、

前言：微信小程序中，onLaunch 方法和 onLoad 方法是同时执行的，但是有时我们需要等 onLaunch 方法执行完毕之后在 onLoad 方法中获取某个网络请求得到的值，由于网络请求有时会比较慢，所以 onLoad 方法可能在 onLaunch 方法之前执行，这时候我们可以自定义 Callback 回调函数来解决问题

实例：在小程序启动时的 onLaunch 方法中网络请求一组数据放入 globalData 全局变量中，在页面的 onLoad 方法中获取全局变量

app.js代码

App({
  //小程序启动后触发
  onLaunch: function() {
    http.postRequest("Home/GetSysInfo", "", res=> {
      //存入全局变量
      this.globalData.tabtext = res.Data;
      // 由于 GetSysInfo 是网络请求，可能会在 Page.onLoad 之后才返回
      // 所以此处加入 Callback 以防止这种情况
      if (this.getSysInfoCallback) {
        this.getSysInfoCallback(res)
      }
    }, function(res) {
      console.log("网络请求失败！")
    });
  },
  //设置全局对象
  globalData: {
    tabtext: [], //系统文字信息
  }
})

.js代码

onLoad: function() {
  //Object.keys().lenght判断全局数组中是否有值
  if (Object.keys(getApp().globalData.tabtext).length>0) {
    //如果有值，则从全局变量中取值
    this.setData({
      titletext: app.globalData.tabtext[0].Desc
    })
  } else {
    //如果无值，调用Callback回调函数直接取值
    app.getSysInfoCallback = res => {
      this.setData({
        titletext: res.Data[0].Desc
      })
    }
  }
}

End！