微信小程序app.js的onLaunch中的异步请求执行完之后再执行Page的onLoad

微信小程序app.js的onLaunch中的异步请求执行完之后再执行Page的onLoad

app.js

App({
  globalData: {
    employ: '',
    onLaunchData: null,
  },
  onLaunch: function () {
    console.log("onlaunch");
    let that = this;
    wx.request({
      url: 'http://XXXXXXXX/XXXXXXXX/XXXXXXXX/XXXXXXXX',
      method: 'POST',
      data: {},
      success: function (res) {
        console.log(res);
        //设置请求的值
        that.globalData.onLaunchData = res.data.data
        //设置请求状态
        that.globalData.employ = true;
       //由于这里是网络请求，可能会在 Page.onLoad 之后才返回  在onLoad中定义下app.employCallback 后才执行下述that.employCallback(true)，此时用户数据肯定得到了，回调内再则可获取到用户数据
       //所以此处加入 callback 以防止这种情况
        if (that.employCallback) {
          that.employCallback(true);
        }
      },
    });
  },
})

index.js

const app = getApp()
Page({
  data: {
    onLaunchData:null,
  },
  onLoad: function (options) {
    let that = this;
    console.log("onload");
    if (app.globalData.employ && app.globalData.employ != '') {
      console.log("first")
      let onLaunchData = app.globalData.onLaunchData;
      that.setData({
        onLaunchData: onLaunchData ? onLaunchData : null
      });
    } else {
      // 由于 onLaunch里执行的 是网络请求，可能会在 Page.onLoad 之后才返回
      // 所以此处加入 callback 以防止这种情况
      app.employCallback = employ => {
        console.log("进入到app.employCallback");
        console.log(that);
        if (employ != '') {
          console.log(employ);
          that.setData({
            onLaunchData: app.globalData.onLaunchData
          });         
        }
      }
    }
  },
})

这里执行的流程是当微信小程序运行时，首先进入到了onLaunch进行执行，因为onLaunch里面有request是异步请求，所以压力来到了index.js的onload里面，在onload里去判断app.js里的数据状态是什么样的，是true就拿request里的数据，如果没有就对app,js的app对象进行添加一个回调函数属性，在这个回调函数属性里需要传入一个true就能操作index.js的page对象里的data,给onlaunch里请求的值赋值给index.js的page对象里的data。这个时候因为之前在onLaunch写的调用自己的在index.js里写的回调，并传入true,对index.js中data中的数据进行赋值。