鸿蒙路由参数传递

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

运行结果如下:

相关推荐
大土豆的bug记录12 小时前
鸿蒙实现自定义类似活体检测功能
数码相机·华为·harmonyos·鸿蒙
hahjee16 小时前
命令行参数解析利器:gnuflag在OpenHarmony PC上的完整适配实战
开源·鸿蒙
kirk_wang17 小时前
Flutter 三方库 `flutter_phone_direct_caller` 在 OpenHarmony 平台的适配实战
flutter·移动开发·跨平台·arkts·鸿蒙
hahjee17 小时前
Go编写的ANSI终端颜色和样式控制库在OpenHarmony PC上的完整适配实战
开发语言·后端·鸿蒙
kirk_wang2 天前
Flutter video_thumbnail 库在鸿蒙(OHOS)平台的适配实践
flutter·移动开发·跨平台·arkts·鸿蒙
JohnnyDeng942 天前
ArkTs-线程池工具封装
线程池·arkts·鸿蒙
后端小张2 天前
【JAVA进阶】鸿蒙开发与SpringBoot深度融合:从接口设计到服务部署全解析
java·spring boot·spring·spring cloud·华为·harmonyos·鸿蒙
kirk_wang2 天前
Flutter 三方库在 OHOS 平台的适配实践:以 flutter_mailer 为例
flutter·移动开发·跨平台·arkts·鸿蒙
kirk_wang3 天前
Flutter media_info插件在OpenHarmony平台的适配实践
flutter·移动开发·跨平台·arkts·鸿蒙
遇到困难睡大觉哈哈5 天前
Harmony os —— Data Augmentation Kit 知识问答实战全流程(流式 RAG 问答踩坑记录)
harmonyos·鸿蒙