鸿蒙路由参数传递

页面test.ets

代码如下:

复制代码
import router from '@ohos.router'
@Entry
@Component
struct Test {
  @State message: string = 'Hello World'
  @State username: string = 'hu'
  @State password: string = '1'

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
          .onClick(() => {
            router.pushUrl({
              url: "pages/mine/MinePage",
              params: {
                username: this.username,
                password: this.password
              }
            })
          })
      }
      .width('100%')
    }
    .height('100%')
  }
}

页面MinePage.ets如下:

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

@Entry
@Component
struct MinePage {
  @State username: string = ''
  @State password: string = ''

  aboutToAppear() {
    const params = router.getParams() as { username?: string; password?: string }
    this.username = params.username ?? ''
    this.password = params.password ?? ''
  }


  build() {
    Column() {
      Text(`欢迎你,${this.username}`)
      Text(`你的密码是:${this.password}`)
    }.padding(20)
  }
}

运行结果如下:

相关推荐
俩毛豆1 小时前
获得2025年度鸿蒙开发者社区贡献榜单(问答产出榜、文章产出榜)
华为·harmonyos·鸿蒙
熊猫钓鱼>_>3 小时前
【开源鸿蒙跨平台开发先锋训练营】Day20 React Native 鸿蒙开发全阶段大复盘:从零到一的跨越
react native·开源·react·harmonyos·鸿蒙·openharmony·native
熊猫钓鱼>_>4 小时前
【开源鸿蒙跨平台开发先锋训练营】Day 12:全场景适配与异常防护——构建高可靠的鸿蒙跨端体验
react native·ui·华为·开源·app·harmonyos·鸿蒙
加农炮手Jinx5 小时前
Flutter for OpenHarmony 实战:network_info_plus 网络扫描与隐私合规深度适配
网络·flutter·华为·harmonyos·鸿蒙
●VON6 小时前
HarmonyOS应用开发实战(基础篇)Day04-《泛型与空值安全》
安全·华为·harmonyos·鸿蒙·von
加农炮手Jinx7 小时前
Flutter for OpenHarmony 实战:Injectable — 自动化依赖注入大师
网络·flutter·华为·harmonyos·鸿蒙
熊猫钓鱼>_>7 小时前
【开源鸿蒙跨平台开发先锋训练营】Day 13:React Native 开发轻量级页面快速响应实践
人工智能·react native·华为·开源·harmonyos·鸿蒙·移动端
SpringSir1 天前
鸿蒙 文字右侧的小红点
鸿蒙
心中有国也有家2 天前
Flutter for OpenHarmony:Flutter 图像渲染核心Image 组件详解
开发语言·前端·flutter·华为·harmonyos·鸿蒙
加农炮手Jinx2 天前
Flutter for OpenHarmony 实战:built_collection 全链路不可变集合模型
网络·flutter·华为·harmonyos·鸿蒙