HarmonyOS 页面导航

Component如何监听应用前后台切换 参考地址：

https://developer.huawei.com/consumer/cn/doc/harmonyos-faqs-V5/faqs-arkui-kit-V5#section986317105383

navigation暂无系统回调，可以用两个变量，一个监控窗口展示的是否是当前页面和 一个监听页面是否在前台，同时满足的时候可以播放 demo如下：

@Component
struct Page01 {
  @Consume('pageInfos') pageInfos: NavPathStack;
  build() {
    NavDestination() {
      Button('push Page01')
        .width('80%')
        .onClick(() => {
          this.pageInfos.pushPathByName('Page01', '');
        })
        .margin({top: 10, bottom: 10})
    }
    .title('Page01')
  }

  aboutToAppear(): void {
    console.log("页面出现")
    AppStorage.set<boolean>('isAppear', false);
  }
  aboutToDisappear(): void {
    console.log("页面消失")
    AppStorage.set<boolean>('isAppear', true);
  }

}

@Entry
@Component
struct Index3 {
  //监听页面是否在前台
  @StorageLink('isOnForeground') @Watch('change') isOnForeground: boolean = true;
  //监控窗口展示的是否是当前页面
  @StorageLink('isAppear') @Watch('isAppearChange') isAppear: boolean = false;
  change() {
    if (this.isOnForeground && this.isAppear ) {
      this.startVideo()
    } else {
      this.endVideo()
    }
  }

  isAppearChange() {
    if (this.isAppear && this.isOnForeground) {
      this.startVideo()
    } else {
      this.endVideo()
    }
  }
  //当窗口展示当前页面且在前台时播放
  startVideo() {
    console.log("播放页面已显示")
  }

  endVideo() {
    console.log("播放页面已隐藏")
  }

  @Provide('pageInfos') pageInfos: NavPathStack = new NavPathStack()
  isLogin: boolean = false;
  @State text: string = "push Page01"
  @Builder
  PagesMap(name: string) {
    Page01()
  }

  aboutToAppear(): void {
    console.log("测试页面出现")
    AppStorage.set<boolean>('isAppear', true);
  }
  aboutToDisappear(): void {
    console.log("测试页面消失")
    AppStorage.set<boolean>('isAppear', false);
  }

  build() {
    Navigation(this.pageInfos) {
      Button(this.text)
        .width('80%')
        .onClick(() => {
          this.pageInfos.pushPathByName('Page01', '');
          //处理相关逻辑
          this.text = "测试一下修改文字"
        })
    }
    .mode(NavigationMode.Stack)
    .titleMode(NavigationTitleMode.Mini)
    .title('主页')
    .navDestination(this.PagesMap)
  }
}