问题：

我有一个页面（@Entry）的根容器名为A，里面使用了Navigation。

然后使用NavPathStack跳转到B界面，B界面使用NavDestination，然后点击B的返回按钮就回到了A。

我有个功能是每次显示A界面时会加载一些业务，A这个时候使用哪个API进行监听这个时机？

Navigation 根页面和 NavDestination 不同，NavDestination 有 onWillAppear、onAppear、onShown 等一系列生命周期，而 Navigation 没有，只有一个 onNavBarStateChange 事件会在根页面显示和隐藏时触发。

所以要监听根页面的跳转，只能使用 onNavBarStateChange 事件来实现，示例如下：

@Entry
@Component
struct Index {
  pathStack: NavPathStack = new NavPathStack();
......
  build() {
    Navigation(this.pathStack) {
......
    }.title('主页面')
    .titleMode(NavigationTitleMode.Mini)
    .navDestination(this.pagesMap)
    // 根页面显示或隐藏时触发
    .onNavBarStateChange((isVisible: boolean) => {
      this.getUIContext().getPromptAction().showToast({ message: `isVisible ${isVisible}.` });
    })
  }
}

效果如下：

完整示例如下：

@Component
struct Page01 {
  pathStack: NavPathStack | undefined = undefined;

  build() {
    NavDestination() {
      Button(`push Page01`).width('80%').margin({ top: 10, bottom: 10 })
        .onClick(() => {
          this.pathStack?.pushPath({ name: 'Page01' });
        })
      Button(`pop`).width('80%').margin({ top: 10, bottom: 10 })
        .onClick(() => {
          this.pathStack?.pop();
        })
    }.title('Page01')
    .onReady((context: NavDestinationContext) => {
      this.pathStack = context.pathStack;
    })
  }
}

@Entry
@Component
struct Index {
  pathStack: NavPathStack = new NavPathStack();

  @Builder
  pagesMap(name: string) {
    if (name == 'Page01') {
      Page01()
    }
  }

  build() {
    Navigation(this.pathStack) {
      Button(`push Page01`).width('80%').margin({ top: 10, bottom: 10 })
        .onClick(() => {
          this.pathStack?.pushPath({ name: 'Page01' });
        })
    }.title('主页面')
    .titleMode(NavigationTitleMode.Mini)
    .navDestination(this.pagesMap)
    // 根页面显示或隐藏时触发
    .onNavBarStateChange((isVisible: boolean) => {
      this.getUIContext().getPromptAction().showToast({ message: `isVisible ${isVisible}.` });
    })
  }
}