小程序app.js中onLaunch異步調用雲函數時,首頁onLoad無法調用異步的問題

按照官方文檔，小程序運行是會先執行app.js中的app方法注冊小程序，因此app方法中的onLaunch會最先執行，接下去才會到首頁的onLoad,然而在onLaunch執行了一個異步方法，比如我這邊請求請求一個雲函數：

onLaunch: function() {
    this.getsys()
},
getsys(){
    wx.cloud.callFunction({
      name:'sysconfig',
      data:{
        command:'get'
      },
    })
    .then(res => {
      let data = res.result.data[0]
      console.log('data',data)
      this.globalData.address = data.address
      this.globalData.name = data.name
    })
},

接下去在首頁中調用：

onLoad: function () {
    console.log('名字是',app.globalData.name)
}

這下直接打印出了：名字是 undefined

經過瘋狂查閱資料，發現利用一個callback回調即可解決問題，修改后的代碼

app.js

onLaunch: function() {
    this.getsys()
},
getsys(){
    wx.cloud.callFunction({
      name:'sysconfig',
      data:{
        command:'get'
      },
    })
    .then(res => {
      let data = res.result.data[0]
      console.log('data',data)
      this.globalData.address = data.address
      this.globalData.name = data.name
      //由於這里是網絡請求，可能會在 Page.onLoad 之后才返回
      // 所以此處加入 callback 以防止這種情況
      if (this.addressCallback){
        this.addressCallback(data.address);
      }
      if (this.nameCallback){
        this.nameCallback(data.name);
      }
    })
},    

 

index.js

onLoad: function () {
     //判斷是app.globalData.address是否存在
    if (!app.globalData.address || app.globalData.address == '') {
      app.addressCallback = address => {
        console.log('address=',address)
        this.setData({
          address:address
        })
      }
    } 
    //判斷是app.globalData.name是否存在
    if (!app.globalData.name || app.globalData.name == '') {
      app.nameCallback = name => {
        console.log('name=',name)
        this.setData({
          name:name
        })
      }
    } 
},

 

再調試一下，bingo!