@
遇到问题
请求api返回需要先登录,实际上登录已成功
想必大家在开发小程序的时候,肯定遇到了页面请求数据加载接口先执行,wx.login()登录接口后执行,导致请求接口返回请先登录,实际上登录确实成功的异常情况!
问题分析
在微信小程序中,由于app.js中的onLaunch和其他页面中js的onLoad属于异步执行。
有时onLaunch中会有网络请求,在等待网络返回值时,也就是还未执行完时,其他页面中js的onLoad已经执行了。这时就会导致页面中的onLoad函数没有获取到登录成功后的token以及其他必备参数,从而导致请求接口时,因为缺失必备参数获得的返回值异常的情况。
解决问题
自定义回调函数
这里我们在app.js中,自定义一个名为 loginCallback 回调函数,然后再页面的onLoad()函数中,监听 loginCallback 函数的执行,继续完成需要执行的操作即可。
app.js
App<IAppOption>({
onLaunch(options) {
let that = this;
wx.login({
success: res => {
api.login(res.code, scene).then(() => {
if (that.loginCallback){
that.loginCallback(1); // 执行自定义回调函数
}
});
},
});
});
});
index.js
const app = getApp<IAppOption>()
Page({
onLoad() {
app.loginCallback = flag => { // 监听自定义回调函数执行
if(flag) {
api.post('/xxxxxxxxxxxxx').then((res) => { // post api
// do something
});
}
}
})
})
扩展提问
上述代码中,app.js里 loginCallback 其实并未单独定义,但是也能够执行成功,是为什么呢?
请发表评论