鸿蒙 - arkTs: 页面路由

页面栈最大容量为32,使用router.clear()可以清空页面栈,释放资源

跳转方式:

  1. router.pushUrl:目标页压入页面栈,使用router.back()可以返回上个页面。
  2. router.replaceUrl:目标页替换当前页,会清空页面栈,释放资源;无法返回上个页面。

实例模式:

  1. Standard:(默认)标准实例模式,每次跳转都会创建一个目标页压入栈顶。
  2. Single:单实例模式,如果目标页已经存在于栈中,则离栈顶最近的同url页面会被移动到栈顶并重新加载

使用示例:

index.ets页面代码:

复制代码
import router from '@ohos.router';

@Entry
@Component
struct Index {
  build() {
    Column() {
      Button('跳转页面')
        .onClick(()=>{
          // 路由跳转
          router.pushUrl(
            {
            url: 'pages/Header', // 路由地址
            params: {id: '996'} // 携带参数
          },
            router.RouterMode.Single,
            err => {
              if(err){
                console.log(JSON.stringify(err))
              }
            }
          )
        })
    }
  }
}

Header.ets页面代码:

复制代码
import router from '@ohos.router'

@Entry
@Component
struct Header {
  // 接收页面参数
  params: any = router.getParams()

  build(){
    Row() {
      Text(this.params.id) // 展示参数
        .fontSize(30)
      Button('返回上个页面')
        .onClick(()=>{
          // pushUrl跳转情况下可以返回上个页面
          router.back()
        })
    }
  }
}
相关推荐
jiejiejiejie_2 小时前
Flutter 三方库 pull_to_refresh 的鸿蒙化适配指南
flutter·华为·harmonyos
前端技术7 小时前
通信网络基础(下篇):TCP/IP网络参考模型与传输层协议深度解析
华为
IntMainJhy11 小时前
Flutter 三方库 ImageCropper 图片裁剪鸿蒙化适配与实战指南(正方形+自定义比例全覆盖)
flutter·华为·harmonyos
IntMainJhy11 小时前
Flutter for OpenHarmony 第三方库六大核心模块整合实战全解|从图片处理、消息通知到加密存储、设备推送 一站式鸿蒙适配开发总结
flutter·华为·harmonyos
key_3_feng11 小时前
HarmonyOS 6.0 元服务(Meta Ability)深度设计方案
pytorch·深度学习·harmonyos·元服务
UnicornDev11 小时前
【HarmonyOS 6】基于API23的底部悬浮导航
华为·harmonyos·arkts·鸿蒙·鸿蒙系统
音视频牛哥11 小时前
鸿蒙 NEXT 时代:如何构建工业级稳定和低延迟的同屏推流模块?
华为·harmonyos·大牛直播sdk·鸿蒙next 无纸化同屏·鸿蒙next同屏推流·鸿蒙rtmp同屏·鸿蒙无纸化会议同屏
IntMainJhy11 小时前
【fluttter for open harmony】Flutter 三方库适配实战:在 OpenHarmony 上实现图片压缩功能(附超详细踩坑记录)
flutter·华为·harmonyos
jiejiejiejie_11 小时前
Flutter for OpenHarmony 多语言国际化超简单实现指南
flutter·华为·harmonyos
2301_8148098612 小时前
【HarmonyOS 6.0】ArkWeb 嵌套滚动快速调度策略:从机制到落地的全景解析
华为·harmonyos