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

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

一、生命周期阶段:

创建阶段
build:

构建组件的 UI 结构和样式。

onDidBuild:

build 方法执行完毕后调用,可用于数据初始化或额外的 UI 调整。

挂载阶段
onPageShow:

页面显示时调用。
onReady:

组件挂载到页面后调用。
onWindowStageShow:

窗口显示时调用。

交互阶段
onBackPress:

用户点击返回按钮时调用。

销毁阶段
onPageHide:

页面隐藏时调用。

onDestroy:

组件销毁时调用。

二、页面和组件的生命周期函数如何区分?

首先我们需要理解页面和自定义组件的概念。

在 ArkUI 中,页面组件指的是被@Entry装饰的组件,其拥有独特的生命周期接口,这些接口对页面在不同状态下的行为控制起着关键作用。

自定义组件则由@Component装饰。

如何分清楚哪些是页面独有的生命周期函数呢?关键点在于函数名字中的page,例如onPageShow,onPageHide这两个就是页面独有。并且还有个特殊的函数,即:返回按钮触发函数,onBackPress。只需要记住,只有页面才能响应返回按钮即可。

三、DEMO示例

dart 复制代码
@Entry
@Component
struct LifeCycleExample {
  build() {
    Column({ space: 50 }) {
      Text('生命周期示例')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
    }
    .width('100%')
  }

  onDidBuild() {
    console.log('build方法执行完毕');
  }

  onPageShow() {
    console.log('页面显示');
  }

  onReady() {
    console.log('组件挂载完成');
  }

  onWindowStageShow() {
    console.log('窗口显示');
  }

  onBackPress(): boolean {
    console.log('点击返回按钮');
    return false;
  }

  onPageHide() {
    console.log('页面隐藏');
  }

  onDestroy() {
    console.log('组件销毁');
  }
}
相关推荐
熊猫钓鱼>_>38 分钟前
【开源鸿蒙跨平台开发先锋训练营】Day 7:开源鸿蒙开发第一阶段复盘与技术深度总结
react native·华为·开源·harmonyos·arkts·openharmony·rnoh
程序员清洒6 小时前
Flutter for OpenHarmony:GridView — 网格布局实现
android·前端·学习·flutter·华为
Miguo94well6 小时前
Flutter框架跨平台鸿蒙开发——地理知识速记APP的开发流程
flutter·华为·harmonyos·鸿蒙
时光慢煮7 小时前
【Flutter × OpenHarmony】跨端开发实现全局Toast提示卡片
flutter·华为·开源·openharmony
IT陈图图7 小时前
Flutter × OpenHarmony 混合布局实战:在一个容器中优雅组合列表与网格
flutter·鸿蒙·openharmony
讯方洋哥8 小时前
HarmonyOS App开发——鸿蒙音乐播放机应用App开发
华为·harmonyos
小雨青年9 小时前
【鸿蒙原生开发会议随记 Pro】 会议随记 Pro v1.1 发布 详解 HarmonyOS NEXT 原生国际化(i18n)架构与最佳实践
华为·harmonyos
木斯佳10 小时前
HarmonyOS 6实战(源码教学篇)— Speech Kit TextReader:【仿某云音乐接入语音朗读控件】
华为·harmonyos
南村群童欺我老无力.10 小时前
Flutter 框架跨平台鸿蒙开发 - 校园生活一站式:打造智慧校园服务平台
flutter·华为·harmonyos
IT陈图图12 小时前
跨端一致的交互体验实践:基于 Flutter × OpenHarmony 的 AlertDialog 对话框示例解析
flutter·交互·鸿蒙·openharmony