微信小程序中当有异步操作或者耗时同步操作时,不能保证app.js中的onLaunch与page.js - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

微信小程序中当有异步操作或者耗时同步操作时,不能保证app.js中的onLaunch与page.js

发表时间:2020-9-26

发布人:葵宇科技

浏览次数:128

微信小程序中当有异步操作或者耗时同步操作时,不能保证app.js中的onLaunch与page.js中onLoad先后执行顺序的解决方案

我在此为大家汇总了三种解决方案,大家普遍都会用这里的前两种方法,个人认为我的第三种方法更加巧妙且方便

方法一:

解决方法:定义回调函数
小程序网络请求默认为异步请求,在appjs的onLaunch运行后进行异步请求时,程序不会停止,Page页已执行onload,
我们希望onLaunch执行完后再执行onload。 目标:>//app.js App({ >: function () { wx.request({ url: 'http://test.cn/login', //仅为示例,并非真实的接口地址 data: {}, success: function(res) { this.globalData.checkLogin = true; //由于这里是网络请求,可能会在 Page.onLoad 之后才返回 // 所以此处加入 callback 以防止这种情况 if (this.checkLoginReadyCallback){ this.checkLoginReadyCallback(res); } } }) }, globalData: { checkLogin: false } }) //index.js //获取应用实例 const app = getApp() Page({ data: { test: false }, >: function () { let that = this; //判断onLaunch是否执行完毕 if (app.globalData.checkLogin){ that.setData({ test:true }) }else{ app.checkLoginReadyCallback = res => { that.setData({ test:true }) }; } } })

执行顺序:[App]> //app.js: //将你本来写在>:function(){ login:function(){ let that = this; return new Promise(function (resolve, reject) { // 登录 wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId if (res.code) { // console.log('获取用户登录凭证:' + code); // ------ 发送凭证 ------ /* * 通过code获取登录session */ wx.request({ url: 'xxx/login?code=' + res.code, method: 'GET', header: { 'content-type': 'application/json' }, success: function (res) { console.log(res) if (res.statusCode == 200) { // 注意这里 resolve(res); } else { console.log(res.errMsg) } }, }) } else { console.log('获取用户登录失败:' + res.errMsg); } } }) }) } } //page.js onLoad: function (options) { let _this = this; app.login().then(function (res) { let newDate = new Date(); // 修改到当前的时间 _this.changeNowTime(); }) },

方法三:

解决方法:通过getCurrentPages()[0].onLoad()重新执行一次page.js中的onLoad方法
不用每个页面都写相关逻辑,只需要在app.js中加入以下几行相关代码即可
缺点:page.js中的onload方法会执行两次!

//app.js
>: function (info) {
        //当进入小程序的场景为通过分享进入时,预防onLoad钩子请求不到数据
        if (info.path !== 'xxxxx/xxx/xxx') {
            console.log('info', info);
            setTimeout(() => {
                console.log('getCurrentPages', getCurrentPages());
                getCurrentPages()[0].onLoad(info.query);
            }, 1000);
        }
        // 登录
        wx.login({
            success: (xxx) => {
               	//xxxxxx
            },
        });
    }

最后:希望大家补充其它相关方法,分享是每一位程序员都要有的美德~

转载请注明出处!谢谢~
by:汪荣顶

相关案例查看更多