头条⼩程序如何确保异步请求执⾏完后再执⾏各页⾯的
onLoad⽅法
/头条⼩程序如何确保异步请求执⾏完后再执⾏各页⾯的onLoad⽅法
在开发的过程中,由于⼩程序⽣命周期的执⾏顺序是不可暂停的,以登录权限为例:
当进⼊⼩程序时⾸先执⾏app.js的onLaunch--onShow⽅式后再执⾏b页⾯的onLoad⽅法,b页⾯需要弹出提⽰登录的弹窗,当服务器返回需要⼀定时间或⽹络较差时,此时⼩程序已经执⾏了b页⾯的⽅法,导致在登录接⼝还没有返回前就已经在b页⾯判断了权限。
app.js
onLaunch() {
loginByCode().then(resolve => {
//do something
});
}
loginByCode() {
return new Promise(resolve => {
url: 'xxx',
method: 'GET',
data: {},
success: ({
data,
statusCode,
header
}) => {
//接⼝返回结果后将登录状态置为true
app.globalData.loginPermissions = true;
resolve();
}
})
});
}
这⾥我们在⼩程序冷启动时onLaunch中做了个简单的异步请求。
页⾯b.js
onLoad() {
/
/当进⼊此页⾯时,需要判断是否已登录⽤户,如果没有登录需要弹出登录弹窗
如何制作app小程序if(!app.globalData.loginPermissions) {
this.loginPopup.open();
}else {
//do something
}
}
假如按照以上⽅式处理,会导致loginByCode登录接⼝返回缓慢时,进⼊b页⾯后,即使⽤户已经是登录的状态,但依然会弹出登录窗⼝。
对于上述问题,我们来改进⼀下代码
app.js
onLaunch() {
loginByCode().then(resolve => {
if (this.loginCallBack) {
//这⾥的this 是指当前页⾯的this
this.loginCallBack();
}
});
}
loginByCode() {
return new Promise(resolve => {
url: 'xxx',
method: 'GET',
data: {},
success: ({
data,
statusCode,
header
}) => {
//接⼝返回结果后将登录状态置为true
app.globalData.loginPermissions = true;
resolve();
}
})
});
}
页⾯b.js
onLoad() {
//当进⼊此页⾯时,需要判断是否已登录⽤户,如果没有登录需要弹出登录弹窗 if(app.globalData.loginPermissions && app.globalData.loginPermissions != '') { //do something
}else {
app.loginCallBack = () => {
if (!app.globalData.loginPermissions) this.loginPopup.open();
else this.loginPopup.close();
}
}
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论