uniapp 应用启动onLaunch方法,改为同步,执行后再执行页面加载onLoad方法

问题描述

在app.vue里面onLaunch中获取openid和token,获取成功之后,进入页面调数据接口报错,因为token没有带过去,为了让页面在onLaunch执行完之后再去页面调接口

解决方案

way1

在main.js里面添加

Vue.prototype.$onLaunched = new Promise(resolve => {
    Vue.prototype.$isResolve = resolve
})

然后再app.vue的onLaunch里面加this.$isResolve()

onLaunch () {
    // #ifndef H5
    uni.login({
        success: loginRes => {
            // #ifdef MP-WEIXIN
            login({ // 该接口为我们自己写的获取 openid/token 的接口,请替换成自己的
                appId: 'wx1234567890',
                code: loginRes.code
            }).then(res => {
                try {
                    console.info(res.object.token)
                    uni.setStorageSync('mcToken', res.object.token)
                    this.$isResolve()
                } catch (e) {
                    console.error(e)
                }
            })
            // #endif
        }
    })
    // #endif
}

再自己的业务页面onLoad中增加await this.$onLaunched

async onLoad(option) {
    //等待登录成功    
    await this.$onLaunched;
    
    // 后续业务逻辑
},

需要注意的是onload前面要加async,否则编译不过去

way2

首先再main.js里面增加

    //页面入参option
    
    //自己的业务逻辑   
    
    //如果是ajax,注意要加同步等待
    await Vue.prototype.http.post('/customer/updateLastVisitStoreId',{lastVisitStoreId:storeId}).then(res => {      
        console.log(res);
        
    }).catch(err => {
        console.log(err);
    })
 
}

然后再业务页面onload增加

async onLoad(option) {          
    await this.$visitStore(option);//同步执行这个方法
 
}
微信图片_20211208152033.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容