【鸿蒙学习条记】组件生命周期・页面生命周期
官方文档：页面和自界说组件生命周期组件生命周期
被@Component装饰的组件便可以调用组件的生命周期。
[*]aboutToAppear：实例创建后，在实行其build()函数之前实行。
[*]onDidBuild：组件build()函数实行完成之后回调该接口。
[*]aboutToDisappear：实例销毁前。
创建实例 → aboutToAppear → build() → onDidBuild → … → aboutToDisappear → 实例销毁
页面生命周期
只有被@Entry装饰的组件才可以调用页面的生命周期。
[*]onPageShow：页面表现时实行
[*]onPageHide：页面隐藏时实行
[*]onBackPress：点击返回键实行
练习中明确
FirstPage.ets
import { router } from '@kit.ArkUI'
@Entry
@Component
struct FirstPage {
@State message: string = 'First Page';
build() {
Row() {
Column() {
Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
Button('Next')
.onClick(() => {
router.pushUrl({
url: "pages/SecondPage"
})
})
}
.width('100%')
}
.height('100%')
}
aboutToAppear(): void {
console.log("FirstPage----------aboutToAppear1")
}
aboutToDisappear(): void {
console.log("FirstPage----------aboutToDisappear1")
}
onPageShow(): void {
console.log("FirstPage----------onPageShow1")
}
onPageHide(): void {
console.log("FirstPage----------onPageHide1")
}
onBackPress(): boolean | void {
console.log("FirstPage----------onBackPress1")
}
}
SecondPage.ets
import { router } from '@kit.ArkUI'
@Entry
@Component
struct SecondPage {
@State message: string = 'Second Page';
build() {
Row() {
Column() {
Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
Button("Back")
.onClick(() => {
router.back()
})
}
.width('100%')
}
.height('100%')
}
aboutToAppear(): void {
console.log("FirstPage----------aboutToAppear2")
}
aboutToDisappear(): void {
console.log("FirstPage----------aboutToDisappear2")
}
onPageShow(): void {
console.log("FirstPage----------onPageShow2")
}
onPageHide(): void {
console.log("FirstPage----------onPageHide2")
}
onBackPress(): boolean | void {
console.log("FirstPage----------onBackPress2")
}
}
https://i-blog.csdnimg.cn/direct/68897f234c64424396348f523b1d6699.png
第１步：加载 First Page
app Log: FirstPage----------aboutToAppear1
app Log: FirstPage----------onPageShow1
第２步：First Page → 点Next按钮
app Log: FirstPage----------onPageHide1
app Log: FirstPage----------aboutToAppear2
app Log: FirstPage----------onPageShow2
第３步：Second Page → 点back按钮
app Log: FirstPage----------onPageHide2
app Log: FirstPage----------onPageShow1
app Log: FirstPage----------aboutToDisappear2
第４步：First Page → 点Next按钮
app Log: FirstPage----------onPageHide1
app Log: FirstPage----------aboutToAppear2
app Log: FirstPage----------onPageShow2
第５步：Second Page → 点返回按钮
app Log: FirstPage----------onBackPress2app Log: FirstPage----------onPageHide2
app Log: FirstPage----------onPageShow1
app Log: FirstPage----------aboutToDisappear2
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]