小程序模板網(wǎng)

微信小程序onLaunch異步,首頁onLoad先執(zhí)行?

發(fā)布時間:2018-09-22 08:53 所屬欄目:小程序開發(fā)教程

本來按照事件順序,小程序初始化時觸發(fā)App里的onLaunch,后面再執(zhí)行頁面Page里的onLoad,但是在onLaunch里請求獲取是否有權(quán)限,等待返回值的時候Page里的onLoad事件就已經(jīng)執(zhí)行了。

 

				
  1. //app.js
    App({
    onLaunch: function () {
    console.log('onLaunch');
    wx.request({
    url: 'test.php', //僅為示例,并非真實(shí)的接口地址
    data: {
    },
    success: function(res) {
    console.log('onLaunch-request-success');
    // 將employId賦值給全局變量,提供給頁面做判斷
    this.globalData.employId = res.employId;
    }
    })
    },
    globalData: {
    employId: ''
    }
    })
    

				
  1. //index.js
    //獲取應(yīng)用實(shí)例
    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
    });
    }
    })

控制臺打印的結(jié)果是

 

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

要是能等完onLaunch請求完再執(zhí)行Page的onLoad方法那該多好。  這里采用的方法是定義一個回調(diào)函數(shù)。  Page頁面判斷一下當(dāng)前app.globalData.employId是否有值,如果沒有(第一次)則定義定義一個app方法(回調(diào)函數(shù))app.employIdCallback = employId => {...}。  App頁面在請求success后判斷時候有Page頁面定義的回調(diào)方法,如果有就執(zhí)行該方法。因?yàn)榛卣{(diào)函數(shù)是在Page里面定義的所以方法作用域this是指向Page頁面。

 

				
  1. //app.js
    App({
    onLaunch: function () {
    wx.request({
    url: 'test.php', //僅為示例,并非真實(shí)的接口地址
    data: {
    },
    success: function(res) {
    this.globalData.employId = res.employId;
    //由于這里是網(wǎng)絡(luò)請求,可能會在 Page.onLoad 之后才返回
    // 所以此處加入 callback 以防止這種情況
    if (this.employIdCallback){
    this.employIdCallback(res.employId);
    }
    }
    })
    },
    globalData: {
    employId: ''
    }
    })
 

				
  1. //index.js
    //獲取應(yīng)用實(shí)例
    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 是網(wǎng)絡(luò)請求,可能會在 Page.onLoad 之后才返回
    // 所以此處加入 callback 以防止這種情況
    app.employIdCallback = employId => {
    if (employId != '') {
    this.setData({
    albumDisabled: false,
    bindDisabled: true
    });
    }
    }
    }
    }
    })

這樣的話,就能實(shí)現(xiàn)想要的結(jié)果。執(zhí)行順序就是:

 

				
  1. [App] onLaunch -> [Page] onLoad -> [App] onLaunch sucess callback


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://m.u-renovate.com/wxmini/doc/course/24834.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢
AI智能客服 ×