uniapp应用周期
uniapp应用生命周期
uniapp的应用生命周期分为应用级别和页面级别,涵盖了从启动到销毁的完整流程。以下是详细说明:
应用生命周期(App.vue中定义)
onLaunch
触发时机:应用初始化完成时(全局只触发一次)。
用途:常用于获取用户信息、检查更新、初始化全局数据。
示例代码:
onLaunch(options) {
console.log('App Launch', options);
// 获取用户信息或检查版本更新
}
onShow
触发时机:应用启动或从后台进入前台显示。
用途:处理场景值(如小程序二维码参数)、恢复数据状态。
示例代码:
onShow(options) {
console.log('App Show', options.scene);
}
onHide
触发时机:应用从前台进入后台。
用途:保存临时数据、清理定时器。
示例代码:
onHide() {
console.log('App Hide');
}
onError
触发时机:脚本错误或API调用失败时。
用途:捕获全局错误并上报。
示例代码:

onError(err) {
console.error('Global Error:', err);
}
页面生命周期(页面vue文件中定义)
onLoad
触发时机:页面加载时。
参数:接收路由传递的query或params。
用途:初始化页面数据。
示例代码:
onLoad(options) {
this.id = options.id; // 获取路由参数
}
onShow
触发时机:页面显示/切入前台时。
与onLoad区别:每次页面显示都会触发(如返回页面)。
用途:刷新动态数据(如用户状态变化)。
onReady
触发时机:页面初次渲染完成。
用途:操作DOM或调用原生组件(需注意平台差异)。

onHide
触发时机:页面隐藏/切入后台。
用途:暂停定时器或动画。
onUnload
触发时机:页面卸载时(如路由跳转关闭当前页)。
用途:清理非响应式资源(如事件监听)。
组件生命周期
与Vue标准生命周期一致(如created、mounted),同时支持onBackPress(监听返回按钮,需返回布尔值阻止默认行为)。
注意事项
- 平台差异:部分生命周期仅特定平台支持(如小程序onShareAppMessage)。
- 异步问题:避免在
onReady前操作DOM,可通过nextTick延迟执行。 - 性能优化:高频触发事件(如onscroll)建议使用节流。






