UniApp 页面函数执行顺序控制:先运行 app.vue 的 onLaunch()
要先运行 app.vue 中的 onLaunch() 函数,再运行页面的函数,可以在页面的生命周期函数中进行判断和调用。具体的实现步骤如下:
- 在 app.vue 中的 onLaunch() 函数中,定义一个全局变量,用来表示 onLaunch() 是否已经执行完成,例如 isLaunch。
export default {
onLaunch() {
// 执行一些需要在启动时执行的操作
// 设置 isLaunch 为 true 表示 onLaunch() 已经执行完成
this.isLaunch = true;
},
isLaunch: false
}
- 在需要在页面中执行的函数所在的页面的生命周期函数中,判断 isLaunch 的值,若为 true,则直接调用该函数,若为 false,则等待 onLaunch() 执行完成后再调用。
export default {
onLoad() {
if (getApp().isLaunch) {
// onLaunch() 已经执行完成,直接调用需要执行的函数
this.pageFunction();
} else {
// onLaunch() 还未执行完成,监听 onLaunch() 完成后再调用需要执行的函数
getApp().$watch('isLaunch', (value) => {
if (value) {
this.pageFunction();
}
});
}
},
pageFunction() {
// 需要在页面中执行的函数
}
}
通过以上的步骤,可以在页面加载时先判断 onLaunch() 是否已经执行完成,若已完成则直接调用页面函数,若未完成则等待 onLaunch() 完成后再调用。
原文地址: https://www.cveoy.top/t/topic/o34z 著作权归作者所有。请勿转载和采集!