一、应用生命周期的核心概念

在UniApp跨平台开发框架中，应用生命周期是管理应用全局状态的核心机制。与页面生命周期不同，应用生命周期作用于整个App实例，贯穿从初始化到销毁的全过程。开发者通过监听这些生命周期事件，可以实现以下关键功能：

应用首次启动时的资源预加载
前后台切换时的状态保存与恢复
错误发生时的全局捕获与处理
第三方SDK的初始化时机控制

典型应用场景包括：用户登录状态持久化、WebSocket长连接管理、全局数据缓存策略等。理解这些机制对构建稳定高效的跨平台应用至关重要。

二、五大核心生命周期详解

1. onLaunch：应用初始化入口

当UniApp实例首次创建时触发，全局仅执行一次。这是执行应用级初始化的最佳位置，典型用例包括：

App({
  onLaunch(options) {
    // 解析启动参数
    console.log('启动参数:', options.query);
    // 初始化全局配置
    this.globalData = {
      userInfo: null,
      systemInfo: uni.getSystemInfoSync()
    };
    // 预加载核心数据
    this.preloadCriticalData();
  }
})

关键特性：

接收options参数包含场景值(scene)、路径参数(path)等
适合执行耗时操作（需注意冷启动时间限制）
在多端适配时需处理平台差异（如小程序与App端参数结构不同）

2. onShow：应用可见性变化

每次应用进入前台时触发，包括首次启动和从后台恢复。常见应用场景：

onShow(options) {
  // 更新页面栈信息
  const pages = getCurrentPages();
  console.log('当前页面栈:', pages.map(p => p.route));
  // 恢复WebSocket连接
  if (this.needReconnect) {
    this.reconnectWebSocket();
  }
}

注意事项：

小程序端与App端参数结构存在差异
频繁切换可能导致性能问题，需做防抖处理
结合onHide实现完整的可见性管理

3. onHide：应用进入后台

当应用切换到后台时触发，适合执行资源释放操作：

onHide() {
  // 暂停非关键任务
  clearTimeout(this.timerId);
  // 保存当前状态
  uni.setStorageSync('app_state', this.getCurrentState());
  // App端特殊处理
  if (plus.os.name === 'Android') {
    // 安卓端可能需要调整内存使用
  }
}

优化建议：

区分小程序与App端的后台机制差异
重要数据需及时持久化
避免在此执行同步IO操作

4. onError：全局错误捕获

未处理的Promise拒绝和运行时错误会触发此钩子：

onError(err) {
  // 结构化错误信息
  const errorInfo = {
    message: err.message,
    stack: err.stack,
    timestamp: Date.now()
  };
  // 上报到监控系统
  this.reportError(errorInfo);
  // 开发环境显示错误详情
  if (process.env.NODE_ENV === 'development') {
    uni.showModal({
      title: '应用错误',
      content: JSON.stringify(errorInfo)
    });
  }
}

最佳实践：

实现错误堆栈的格式化处理
区分开发环境与生产环境的处理策略
结合日志服务构建完整的错误监控体系

5. onUnload（扩展补充）

虽然原生生命周期不包含此钩子，但可通过页面生命周期的onUnload配合实现应用卸载逻辑。在App端可通过监听系统事件模拟：

// App端特殊处理
if (plus.os.name === 'iOS') {
  plus.globalEvent.addEventListener('pause', () => {
    // iOS应用进入后台的特殊处理
  });
}

三、生命周期管理最佳实践

1. 状态管理方案

推荐采用Vuex或Pinia进行全局状态管理，结合生命周期实现状态持久化：

// store/index.js
export default new Vuex.Store({
  state: {
    userInfo: null
  },
  mutations: {
    initState(state, payload) {
      // 从存储中恢复状态
      const saved = uni.getStorageSync('app_state');
      if (saved) {
        Object.assign(state, saved);
      }
    }
  }
});
// App.vue
onLaunch() {
  this.$store.commit('initState');
}

2. 性能优化策略

延迟初始化：将非关键初始化操作移至onShow
资源预加载：利用onLaunch预加载字体、图片等静态资源
内存管理：在onHide时释放大型对象引用

3. 多端适配技巧

不同平台对生命周期的实现存在差异：
| 特性 | 小程序 | App端 | H5端 |
|——————|————|———-|———|
| onLaunch参数 | 丰富 | 有限 | 无 |
| 后台存活时间 | 有限 | 依赖系统 | 标签页级 |
| 错误捕获范围 | 较全 | 需补充 | 需补充 |

建议通过条件编译处理平台差异：

// #ifdef MP-WEIXIN
const scene = options.scene;
// #endif
// #ifdef APP-PLUS
plus.runtime.getProperty(plus.runtime.appid, (widgetInfo) => {
  console.log('应用版本:', widgetInfo.version);
});
// #endif

四、常见问题解决方案

1. 生命周期执行顺序问题

典型场景：onLaunch中跳转页面导致页面生命周期先于应用生命周期执行。解决方案：

onLaunch() {
  // 使用nextTick确保DOM更新完成
  setTimeout(() => {
    if (!uni.getStorageSync('has_guided')) {
      uni.redirectTo({ url: '/pages/guide' });
    }
  }, 300);
}

2. 错误监控盲区处理

对于异步错误和第三方SDK错误，建议补充封装：

// 封装uni.request
const safeRequest = (options) => {
  return new Promise((resolve, reject) => {
    uni.request({
      ...options,
      success: resolve,
      fail: (err) => {
        App.onError(err);
        reject(err);
      }
    });
  });
};

3. 前后台切换计时

实现精确的可见性时长统计：

let visibleTimestamp = 0;
onShow() {
  visibleTimestamp = Date.now();
}
onHide() {
  const duration = Date.now() - visibleTimestamp;
  console.log(`应用后台停留时间: ${duration}ms`);
  // 上报使用时长数据
}

五、进阶应用场景

1. 结合WebSocket实现实时通信

onShow() {
  if (!this.socketTask) {
    this.socketTask = uni.connectSocket({
      url: 'wss://example.com/ws',
      success: () => console.log('连接建立')
    });
    this.socketTask.onMessage((res) => {
      // 处理消息
    });
  }
}
onHide() {
  // 根据业务需求决定是否关闭连接
  if (this.needCloseOnHide) {
    this.socketTask.close();
    this.socketTask = null;
  }
}

2. 实现离线缓存策略

onHide() {
  // 获取当前页面数据
  const pages = getCurrentPages();
  const currentPage = pages[pages.length - 1];
  const pageData = currentPage.data;
  // 序列化并存储
  uni.setStorage({
    key: `page_cache_${currentPage.route}`,
    data: JSON.stringify(pageData),
    success: () => console.log('缓存成功')
  });
}

3. 多端统一登录状态管理

onLaunch() {
  // 检查本地存储的token
  const token = uni.getStorageSync('auth_token');
  if (token) {
    // 验证token有效性
    this.verifyToken(token).then(() => {
      this.globalData.isLoggedIn = true;
    }).catch(() => {
      uni.removeStorageSync('auth_token');
    });
  }
}
async verifyToken(token) {
  // 实现跨端统一的token验证逻辑
  const res = await uni.request({
    url: 'https://api.example.com/verify',
    method: 'POST',
    data: { token },
    header: { 'Authorization': `Bearer ${token}` }
  });
  return res.data.valid;
}

通过系统掌握这些生命周期管理技术，开发者能够构建出更加健壮、高效的跨平台应用。建议结合实际项目需求，逐步实践这些高级模式，最终形成适合自身业务场景的生命周期管理方案。

UniApp应用生命周期全解析：从基础到实战的完整指南