Апплет WeChat onLaunch является асинхронным, а домашняя страница onLoad выполняется первой?

Апплет WeChat

Изначально, согласно последовательности событий, onLaunch в приложении срабатывает при инициализации апплета, а onLoad на странице выполняется позже, но событие onLoad на странице уже выполняется, когда onLaunch запрашивается для получения разрешение и ожидание возвращаемого значения.

//app.js
App({
  onLaunch: function () {
    console.log('onLaunch');
    wx.request({
      url: 'test.php', //仅为示例，并非真实的接口地址
      data: {
      },
      success: function(res) {
        console.log('onLaunch-request-success');
        // 将employId赋值给全局变量，提供给页面做判断
        this.globalData.employId = res.employId;   
      }
    })
  },
  globalData: {
    employId: ''
  }
})

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    albumDisabled: true,
    bindDisabled: false
  },
  onLoad: function () {
    console.log('onLoad');
    console.log('onLoad app.globalData.employId = ' + app.globalData.employId);
    //判断是用户是否绑定了
    if (app.globalData.employId && app.globalData.employId != '') {
      this.setData({
        albumDisabled: false,
        bindDisabled: true
      });
  }
})

Результат, напечатанный на консоли,

onLaunch
onLoad
onLoad app.globalData.employId = 
onLaunch-request-success

Было бы неплохо, если бы вы могли дождаться завершения запроса onLaunch, прежде чем выполнять метод страницы onLoad.
Здесь используется методопределить функцию обратного вызова.
Страница страницы оценивает, имеет ли текущий app.globalData.employId значение, если нет (в первый раз), определите метод приложения (функция обратного вызова).app.employIdCallback = employId => {...}.
Страница приложения имеет метод обратного вызова, определенный страницей страницы, когда она оценивает после запроса об успешном выполнении и выполняет метод, если он есть. Поскольку функция обратного вызова определена на странице, область действия этого метода указывает на страницу страницы.

//app.js
App({
  onLaunch: function () {
    wx.request({
      url: 'test.php', //仅为示例，并非真实的接口地址
      data: {
      },
      success: function(res) {
        this.globalData.employId = res.employId;
        //由于这里是网络请求，可能会在 Page.onLoad 之后才返回
        // 所以此处加入 callback 以防止这种情况
        if (this.employIdCallback){
           this.employIdCallback(res.employId);
        }
      }
    })
  },
  globalData: {
    employId: ''
  }
})

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    albumDisabled: true,
    bindDisabled: false
  },
  onLoad: function () {
    //判断是用户是否绑定了
    if (app.globalData.employId && app.globalData.employId != '') {
      this.setData({
        albumDisabled: false,
        bindDisabled: true
      });
    } else {
      // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
      // 所以此处加入 callback 以防止这种情况
      app.employIdCallback = employId => {
        if (employId != '') {
          this.setData({
            albumDisabled: false,
            bindDisabled: true
          });
        }
      }
    }
  }
})

Таким образом можно добиться желаемого результата. Порядок выполнения такой:

[App] onLaunch -> [Page] onLoad -> [App] onLaunch sucess callback
Категории