【HarmonyOS 5】鸿蒙页面和组件生命周期函数

【HarmonyOS 5】鸿蒙页面和组件生命周期函数

##鸿蒙开辟本领 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 （金融理财#
在 HarmonyOS Next 5.1 及以上版本中，生命周期体系出现多条理结构，涵盖从应用启动到烧毁的完备流程，各层级生命周期既独立又相互关联：
App 级：应用进程的创建与烧毁
Application 级：应用全局上下文的生命周期
Ability 级：应勤奋能单元的生命周期
页面级：被 @Entry 装饰的组件生命周期
组件级：自界说组件的生命周期
一、生命周期体系总览

层级核心作用典范场景（金融类应用）App进程管理应用进程的创建与烧毁进程启动时加载加密模块，烧毁前清理敏感缓存Application全局资源初始化与设置管理初始化全局加密服务、注册瓦解监控Ability功能单元的窗口与生命周期管理金融首页Ability加载用户资产数据页面（@Entry）页面级UI展示与交互状态管理转账页面表现时革新余额，隐蔽时生存未完成表单组件（@Component）独立UI单元的渲染与资源开释行情组件烧毁时取消实时数据订阅二、各层级生命周期详解

1. 组件生命周期（@Component）

自界说组件是UI的最小单元，生命周期聚焦于“渲染-交互-烧毁”的完备流程，5.1+版本新增onWillDestroy回调，强化资源清理本领。
生命周期函数触发机会金融场景应用build()组件首次渲染或状态（@State）更新时构建UI结构（如行情卡片、生意业务按钮），不可实行耗时操纵onDidBuild()build实行完毕后初始化组件私有数据（如盘算卡片尺寸适配结构）onReady()组件挂载到渲染树（可获取DOM信息）启动组件内动画（如金额数字滚动效果）onWillDestroy()组件即将从渲染树移除前（5.1+新增）取消组件内定时器（如倒计时器）、解绑变乱监听onDestroy()组件完全烧毁时开释组件占用的体系资源（如图片缓存、暂时变量）2. 页面生命周期（@Entry）

页面是被@Entry装饰的特殊组件，继续组件生命周期的同时，新增页面级交互相干函数，是用户视觉感知的直接载体。
生命周期函数触发机会金融场景应用（继续组件生命周期）-同组件生命周期，新增页面专属逻辑onPageShow()页面切换至前台（如从背景切回）革新实时行情数据、验证用户会话有用性onPageHide()页面切换至背景（如跳转至其他页面）停息行情推送、生存未提交的生意业务表单onBackPress()用户点击返回按钮（物理/虚拟）拦截返回（如提示“生意业务未完成，是否离开？”）onWindowStageShow()页面地点窗口表现时规复窗口级交互（如启用手势暗码输入）onWindowStageHide()页面地点窗口隐蔽时禁用窗口级交互（如停息指纹辨认监听）3. Ability生命周期（Stage模子）

Ability是应用的功能单元（如“首页”“生意业务”均为独立Ability），其生命周期围绕窗口舞台（WindowStage）的创建与烧毁，是UI展示的载体。
生命周期函数触发机会金融场景应用onCreate(want, launchParam)Ability首次创建时初始化Ability级资源（如用户Token存储）onWindowStageCreate(windowStage)窗口舞台创建时加载页面（如加载生意业务页面UI）、设置窗口属性（如克制截屏）onWindowStageActive()窗口得到核心时（如用户切回）规复Ability交互（如启用按钮点击变乱）onWindowStageInactive()窗口失去核心时（如用户切走）停息Ability交互（如禁用输入框编辑）onWindowStageDestroy()窗口舞台烧毁时开释窗口资源（如烧毁自界说弹窗）onDestroy()Ability烧毁时清理Ability级数据（如移除暂时生意业务缓存）4. Application生命周期

Application是应用全局上下文，管理全部Ability共享的资源，生命周期贯穿应用从启动到烧毁的全流程。
生命周期函数触发机会金融场景应用onCreate()应用首次启动时初始化全局服务（如网络哀求拦截器、加密工具）onDestroy()应用进程烧毁时清理全局资源（如关闭数据库毗连、注销推送服务）onConfigurationUpdated(config)体系设置变化时（如屏幕旋转）适配横竖屏结构（如行情图表旋转后重绘）onTrimMemory(level)体系内存不足时（level表现告急程度）开释非须要资源（如扫除非核心行情缓存）5. App进程生命周期

App进程是应用运行的载体，其生命周期与体系进程管理强相干，是全部层级生命周期的底子。
状态触发机会与其他生命周期的关联启动用户点击图标/被其他应用叫醒触发Application.onCreate() → Ability.onCreate()运行至少一个Ability处于活泼状态各层级生命周期正常相应（如页面切换、交互）制止用户退出/体系接纳内存触发Ability.onDestroy() → Application.onDestroy()三、生命周期调用次序（完备流程）

以金融类应用“启动首页”为例，各生命周期触发次序如下：

1. App进程启动 → Application.onCreate()（初始化加密服务）
2. → Ability.onCreate()（加载用户Token）
3. → Ability.onWindowStageCreate()（加载首页UI）
4. → Ability.onWindowStageActive()（窗口获焦）
5. → 页面build()（绘制首页布局）
6. → 页面onDidBuild()（初始化行情数据）
7. → 页面onWindowStageShow()（窗口显示）
8. → 页面onReady()（绑定实时行情监听器）
9. → 页面onPageShow()（刷新用户资产）

复制代码

四、代码示例（5.1+版本，金融场景适配）

1. 组件与页面生命周期（行情卡片组件+首页页面）

1. // 自定义组件：行情卡片（@Component）
2. @Component
3. struct MarketCard {
4.   @State price: number = 0
5.   private timerId: number = -1
7.   build() {
8.     Column() {
9.       Text(`实时金价：${this.price.toFixed(2)}元/g`)
10.         .fontSize(16)
11.         .padding(10)
12.     }
13.     .backgroundColor('#f5f5f5')
14.     .borderRadius(8)
15.   }
17.   // 组件挂载后启动行情刷新
18.   onReady() {
19.     console.log('行情卡片：开始监听实时价格')
20.     this.timerId = setInterval(() => {
21.       this.price += Math.random() * 2 - 1 // 模拟价格波动
22.     }, 3000)
23.   }
25.   // 组件销毁前清理定时器（5.1+新增）
26.   onWillDestroy() {
27.     console.log('行情卡片：即将销毁，准备清理资源')
28.   }
30.   // 组件销毁时停止刷新
31.   onDestroy() {
32.     console.log('行情卡片：销毁，停止价格监听')
33.     clearInterval(this.timerId) // 金融场景：必须清理定时器，避免内存泄漏
34.   }
35. }
37. // 页面：首页（@Entry）
38. @Entry
39. @Component
40. struct HomePage {
41.   @State userBalance: number = 0
43.   build() {
44.     Column({ space: 20 }) {
45.       Text('我的资产')
46.         .fontSize(20)
47.         .fontWeight(FontWeight.Bold)
48.       
49.       Text(`总资产：${this.userBalance.toFixed(2)}元`)
50.         .fontSize(18)
51.       
52.       MarketCard() // 引入行情卡片组件
53.       
54.       Button('去交易')
55.         .onClick(() => router.pushUrl({ url: 'pages/TradePage' }))
56.     }
57.     .width('100%')
58.     .padding(16)
59.   }
61.   // 页面显示时刷新资产（金融场景：敏感数据实时更新）
62.   onPageShow() {
63.     console.log('首页显示：刷新用户资产')
64.     this.fetchUserBalance() // 调用接口获取最新资产
65.   }
67.   // 页面隐藏时保存未完成操作
68.   onPageHide() {
69.     console.log('首页隐藏：保存浏览记录')
70.     this.saveBrowseHistory()
71.   }
73.   // 处理返回按钮（拦截退出，提示确认）
74.   onBackPress(): boolean {
75.     console.log('首页返回：检查是否有未提交订单')
76.     if (this.hasUnfinishedOrder()) {
77.       // 金融场景：未完成订单时拦截返回
78.       promptAction.showToast({ message: '有未完成订单，确认离开？' })
79.       return true // 拦截系统默认返回
80.     }
81.     return false
82.   }
84.   // 模拟资产获取
85.   private fetchUserBalance() {
86.     // 实际场景：调用加密接口获取数据
87.     this.userBalance = 50000 + Math.random() * 10000
88.   }
90.   // 模拟保存浏览记录
91.   private saveBrowseHistory() {
92.     // 实际场景：存入本地数据库（需加密）
93.   }
95.   // 模拟检查未完成订单
96.   private hasUnfinishedOrder(): boolean {
97.     return false // 实际场景：根据本地缓存判断
98.   }
99. }

复制代码

2. Ability生命周期（首页Ability）

1. // EntryAbility.ts（首页Ability）
2. import UIAbility from '@ohos.app.ability.UIAbility'
3. import window from '@ohos.window'
4. import { EncryptUtil } from '../common/EncryptUtil' // 金融场景：加密工具类
6. export default class HomeAbility extends UIAbility {
7.   onCreate(want, launchParam) {
8.     console.log('首页Ability：初始化，加载用户Token')
9.     // 金融场景：解密并加载本地存储的用户Token
10.     EncryptUtil.init()
11.   }
13.   // 创建窗口舞台，加载首页页面
14.   onWindowStageCreate(windowStage: window.WindowStage) {
15.     console.log('首页Ability：创建窗口舞台')
16.     // 金融场景：设置窗口不可截屏（保护资产信息）
17.     windowStage.getMainWindow((err, mainWindow) => {
18.       mainWindow.setWindowSecure(true)
19.     })
20.     // 加载首页页面
21.     windowStage.loadContent('pages/HomePage', (err, data) => {})
22.   }
24.   // 窗口获焦时启用交互
25.   onWindowStageActive() {
26.     console.log('首页Ability：窗口获焦，启用按钮点击')
27.   }
29.   // 窗口失焦时暂停交互
30.   onWindowStageInactive() {
31.     console.log('首页Ability：窗口失焦，禁用交互')
32.   }
34.   // 窗口销毁时清理资源
35.   onWindowStageDestroy() {
36.     console.log('首页Ability：窗口销毁，清理加密工具')
37.     EncryptUtil.destroy()
38.   }
40.   onDestroy() {
41.     console.log('首页Ability：销毁，清理Token')
42.     // 金融场景：清除内存中的敏感数据
43.   }
44. }

复制代码

3. Application生命周期（全局设置）

1. // app.ets（Application）
2. import AbilityStage from '@ohos.app.ability.AbilityStage';
3. import { CrashReporter } from '../common/CrashReporter' // 金融场景：崩溃监控
5. export default class MyApplication extends AbilityStage {
6.   onCreate() {
7.     console.log('Application：应用启动，初始化全局服务')
8.     // 金融场景：初始化崩溃监控（记录异常交易）
9.     CrashReporter.init()
10.   }
12.   // 系统配置变化（如屏幕旋转）
13.   onConfigurationUpdated(config) {
14.     console.log('Application：配置变化，适配布局')
15.   }
17.   // 内存不足时释放非核心资源
18.   onTrimMemory(level) {
19.     console.log(`Application：内存不足（等级${level}），清理行情缓存`)
20.     // 金融场景：保留交易相关缓存，清除历史行情缓存
21.   }
23.   onDestroy() {
24.     console.log('Application：应用销毁，清理全局资源')
25.     // 金融场景：关闭数据库连接，清除内存中敏感数据
26.     CrashReporter.destroy()
27.   }
28. }

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

继续阅读请点击广告