0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

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

HarmonyOS解决方案 ? 来源:HarmonyOS解决方案 ? 作者:HarmonyOS解决方案 ? 2025-07-11 18:24 ? 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

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

##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财#

一、生命周期阶段:

创建阶段
build:
构建组件的 UI 结构和样式。

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

挂载阶段
onPageShow:
页面显示时调用。
onReady:
组件挂载到页面后调用。
onWindowStageShow:
窗口显示时调用。

交互阶段
onBackPress:
用户点击返回按钮时调用。

销毁阶段
onPageHide:
页面隐藏时调用。

onDestroy:
组件销毁时调用。

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

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

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

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

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

三、DEMO示例

@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('组件销毁');
  }
}

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 鸿蒙
    +关注

    关注

    60

    文章

    2643

    浏览量

    44242
  • HarmonyOS
    +关注

    关注

    80

    文章

    2128

    浏览量

    33407
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    鸿蒙开发OpenHarmony组件复用案例

    \\\\common.d.ts的自定义组件生命周期里定义了aboutToReuse方法,如下: 自定义组件生命周期回调函数用于通知用户该
    发表于 01-15 17:37

    鸿蒙原生页面高性能解决方案上线OpenHarmony社区 助力打造高性能原生应用

    了 Navigation、NavDestination、NavPathStack 多项系统能力,提供路由拦截、页面生命周期管理、自定义转场动画等功能,并在跳转传参等方面扩展系统能力。通过 HMrouter,开发者无需
    发表于 01-02 18:00

    KaihongOS操作系统:页面生命周期介绍

    页面生命周期 在KaihongOS中,学习页面生命周期前需要先了解自定义组件。 1. 自定义组件
    发表于 04-25 08:18

    UIAbility组件生命周期介绍

    UIAbility组件生命周期 概述 当用户打开、切换和返回到对应应用时,应用中的UIAbility实例会在其生命周期的不同状态之间转换。UIAbility类提供了一系列回调,通过这些回调可以
    发表于 05-16 08:28

    ServiceAbility的生命周期介绍

    ServiceAbility的生命周期 开发者可以根据业务场景重写生命周期相关接口。ServiceAbility生命周期接口说明见下表。 表1 ServiceAbility生命周期
    发表于 05-28 08:22

    关于生命周期中的aboutToAppear和onPageShow的理解和应用

    函数中改变状态变量,更改将在后续执行build()函数中生效。实现自定义布局的自定义组件的aboutToAppear生命周期在布局过程中触发。 onPageShow:
    发表于 06-30 17:32

    vue组件mounted生命周期钩子函数的用法

    vue组件mounted生命周期开发疑惑解答
    发表于 11-11 09:24

    HarmonyOS应用开发-PageAbility生命周期

    pageAbility的生命周期如下图所示:在代码中通过调用下列方法实现生命周期操作:onShow() :Ability由后台不可见状态切换到前台可见状态调用onShow方法,此时用户在屏幕可以看到
    发表于 10-17 11:11

    在S32G2 RM中有“生命周期”,生命周期的完整含义是什么?

    在S32G2 RM中,有“生命周期”。生命周期的完整含义是什么,我们应该如何使用它?
    发表于 04-23 10:37

    华为开发者HarmonyOS零基础入门:生命周期函数应用

    华为开发者HarmonyOS零基础入门:生命周期函数,结合周期函数找到相关主键显示,最新加载渲染函数
    的头像 发表于 10-23 10:52 ?1651次阅读
    华为开发者<b class='flag-5'>HarmonyOS</b>零基础入门:<b class='flag-5'>生命周期函数</b>应用

    Vue入门Vue的生命周期

    .生命周期 4.1生命周期是什么 Vue的生命周期, 就是Vue实例从创建到销毁的过程.
    的头像 发表于 02-06 16:16 ?1083次阅读
    Vue入门Vue的<b class='flag-5'>生命周期</b>

    HarmonyOS开发案例:【UIAbility和自定义组件生命周期

    本文档主要描述了应用运行过程中UIAbility和自定义组件生命周期。对于UIAbility,描述了Create、Foreground、Background、Destroy四种生命周期。对于
    的头像 发表于 05-10 15:31 ?2037次阅读
    <b class='flag-5'>HarmonyOS</b>开发案例:【UIAbility和自定义<b class='flag-5'>组件</b><b class='flag-5'>生命周期</b>】

    鸿蒙Ability Kit(程序框架服务)【UIAbility组件生命周期】实例

    本文档主要描述了应用运行过程中UIAbility和自定义组件生命周期。对于UIAbility,描述了Create、Foreground、Background、Destroy四种生命周期。对于
    的头像 发表于 05-31 15:03 ?1697次阅读
    <b class='flag-5'>鸿蒙</b>Ability Kit(程序框架服务)【UIAbility<b class='flag-5'>组件</b><b class='flag-5'>生命周期</b>】实例

    鸿蒙开发:【PageAbility的生命周期

    PageAbility生命周期是PageAbility被调度到INACTIVE、ACTIVE、BACKGROUND等各个状态的统称。PageAbility生命周期流转及状态说明见如下图1、表1所示。
    的头像 发表于 06-17 10:05 ?1040次阅读
    <b class='flag-5'>鸿蒙</b>开发:【PageAbility的<b class='flag-5'>生命周期</b>】

    鸿蒙开发组件:DataAbility的生命周期

    应用开发者可以根据业务场景实现data.js/data.ets中的生命周期相关接口。DataAbility生命周期接口说明见下表。
    的头像 发表于 06-20 09:39 ?778次阅读