鸿蒙路由参数传递

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

运行结果如下:

相关推荐
●VON9 小时前
HarmonyOS应用开发实战(基础篇)Day08-《构建布局详解上》
华为·harmonyos·鸿蒙·von
加农炮手Jinx2 天前
Flutter for OpenHarmony 实战:疯狂头像 App(三)— 复合动画与交互反馈 — 让 UI 跃动起来
flutter·ui·交互·harmonyos·鸿蒙
_waylau3 天前
鸿蒙架构师修炼之道-架构师设计思维特点
华为·架构·架构师·harmonyos·鸿蒙·鸿蒙系统
Betelgeuse763 天前
【Flutter For OpenHarmony】 项目结项复盘
华为·交互·开源软件·鸿蒙
ITUnicorn4 天前
【HarmonyOS 6】进度组件实战:打造精美的数据可视化
华为·harmonyos·arkts·鸿蒙·harmonyos6
阿林来了6 天前
Flutter三方库适配OpenHarmony【flutter_speech】— 原始插件源码分析
flutter·harmonyos·鸿蒙
阿林来了6 天前
Flutter三方库适配OpenHarmony【flutter_speech】— OpenHarmony 插件工程创建
flutter·harmonyos·鸿蒙
_waylau6 天前
跟老卫学仓颉编程语言开发:浮点类型
人工智能·华为·harmonyos·鸿蒙·鸿蒙系统·仓颉
●VON7 天前
HarmonyOS应用开发实战(基础篇)Day05-《常见布局Row和Column》
学习·华为·harmonyos·鸿蒙·von
阿林来了8 天前
Flutter三方库适配OpenHarmony【flutter_speech】— 开发环境搭建
flutter·harmonyos·鸿蒙