小程序App里的onLaunch和页面Page里的onLoad的异步问题解决方法

273 阅读1分钟

Page页面判断一下当前app.globalData.xxx是否有值,如果没有(第一次)则定义定义一个app方法(回调函数)app.xxxCallback = xxx => {…}

App页面在onLaunch请求success后判断时候有Page页面定义的回调方法,如果有就执行该方法。因为回调函数是在Page里面定义的所以方法作用域this是指向Page页面。

app.js

 App({
  onLaunch: function () {
      this.getUserInfo()
  },
  getUserInfo(){
    wx.request({
        url: 'test.php',
        data: {},
        success: function(res) {
          this.globalData.xxx = res;
          if (this.xxxCallback){
            this.xxxCallback(res);
          }
        }
   })
  }
  globalData: {
   xxx: ''
  }
 })
 

index.js

//获取应用实例
const app = getApp()
Page({
    data: {},
    onLoad: function () {
     if (app.globalData.xxx && app.globalData.xxx != '') {
           …
     } else {
      // 由于 getUserInfo 是网络请求、可能会在 Page.onLoad 之后才返回、所以此处加入 callback 以防止这种情况
      app.xxxCallback = xxx => {
        …
      }
     }
    }
})