uniapp app.vue加载完成后运行首页
因为整个逻辑两个并行的页面和一个全局变量,如何通过全局变量控制两个页面的加载顺序的我问题,我们如果简化成一个页面就好理解。
·
由于app.vue要加载必要数据,但是是异步的,在必要数据还没有获取的时候,就要进入首页,也进行异步请求,,如果首页异步请求比必要数据快,那么就此时就会出现报错,那么如何解决呢
1、main.js添加如下代码
// 这个页面的 Vue.prototype 就是全局变量 this , 然后在 index页面 使用 这个$onLaunched属性 他是一个promise
// 然后使用 在APP.vue 的重要参数结束以后 在给这个promise解开 ,也就是使用这个this_.$isResolve();
Vue.prototype.$onLaunched = new Promise(resolve => {
Vue.prototype.$isResolve = resolve;
})
2 在首页添加 下列代码 并在 await之后填写业务逻辑
async onLoad(o) {
//等待登录成功
await this.$onLaunched;
}
3 在app.vue的onLaunch() 里面写入必要数据的请求,并在.then里面写上this_.$isResolve() 解开首页的进程
onLaunch() {
getCode().then((result) => {
this_.$isResolve();}
因为整个逻辑两个并行的页面和一个全局变量,如何通过全局变量控制两个页面的加载顺序的我问题,我们如果简化成一个页面就好理解
<script>
// 一个async函数
let d = async function () {
// 先打印这个
console.log('111')
let y
// 给x一个promise,
let x = new Promise(resolve => {
setTimeout(() => {
console.log('3333333');
y = resolve;
// 这个是个
y()
}, 0)
})
// 然后是会穿过promise 先打印222
console.log('222222')
// 然后等待Promise的结果
await x
// 这个一定是最后调用的,因为要等待await
console.log('44444444')
}
d()
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)