鸿蒙路由参数传递

页面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)
  }
}

运行结果如下:

相关推荐
●VON8 小时前
HarmonyOS应用开发实战(基础篇)Day01-《ArkTS基本知识》
学习·华为·harmonyos·鸿蒙·von
仓颉编程语言2 天前
鸿蒙仓颉编程语言挑战赛二等奖作品:TaskGenie 打造基于仓颉语言的智能办公“任务中枢”
华为·鸿蒙·仓颉编程语言
_waylau2 天前
鸿蒙架构师修炼之道-架构师的职责是什么?
开发语言·华为·harmonyos·鸿蒙
坚果派·白晓明2 天前
在鸿蒙设备上快速验证由lycium工具快速交叉编译的C/C++三方库
c语言·c++·harmonyos·鸿蒙·编程语言·openharmony·三方库
熊猫钓鱼>_>2 天前
移动端开发技术选型报告:三足鼎立时代的开发者指南(2026年2月)
android·人工智能·ios·app·鸿蒙·cpu·移动端
ITUnicorn2 天前
【HarmonyOS6】ArkTS 自定义组件封装实战:动画水杯组件
华为·harmonyos·arkts·鸿蒙·harmonyos6
晚霞的不甘2 天前
Flutter for OpenHarmony 构建简洁高效的待办事项应用 实战解析
flutter·ui·前端框架·交互·鸿蒙
廖松洋(Alina)2 天前
【收尾以及复盘】flutter开发鸿蒙APP之成就徽章页面
flutter·华为·开源·harmonyos·鸿蒙
廖松洋(Alina)2 天前
【收尾以及复盘】flutter开发鸿蒙APP之打卡日历页面
flutter·华为·开源·harmonyos·鸿蒙
廖松洋(Alina)2 天前
【收尾以及复盘】flutter开发鸿蒙APP之本月数据统计页面
flutter·华为·开源·harmonyos·鸿蒙