HormonyOs之路由简单跳转

news2024/11/15 4:55:32

Navigation路由相关的操作都是基于页面栈NavPathStack提供的方法进行，每个Navigation都需要创建并传入一个NavPathStack对象，用于管理页面。主要涉及页面跳转、页面返回、页面替换、页面删除、参数获取、路由拦截等功能。

@Entry
@Component
struct Index {
  // 创建一个页面栈对象并传入Navigation 并分发下去使子组件也能使用

  @Provide('pageInfos') pageInfos: NavPathStack = new NavPathStack()
  @Builder
  PageMap(name: string) {
    if (name === "NavDestinationTitle1") {
      pageOneTmp()
    }
  }
  build() {
    Navigation(this.pageInfos) {

      Button('dianji').onClick((event: ClickEvent) => {
        console.log('dianjile')
        this.pageInfos.pushPath({ name: "NavDestinationTitle1", param: "PageOne Param" })

      })
    }
    .title('Main')
    .titleMode(NavigationTitleMode.Full)
    .navDestination(this.PageMap)
  }
}

@Component
export struct pageOneTmp {
  @Consume('pageInfos') pageInfos: NavPathStack;
  build() {
    NavDestination() {
      Column() {
        Text("NavDestinationContent1")
      }.width('100%').height('100%')
    }.title("NavDestinationTitle1")
    .onBackPressed(() => {
      const popDestinationInfo = this.pageInfos.pop() // 弹出路由栈栈顶元素
      console.log('pop' + '返回值' + JSON.stringify(popDestinationInfo))
      return true
    })
  }
}

效果图是这样的点击按钮实现跳转