鸿蒙路由参数传递

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

运行结果如下:

相关推荐
奋斗的小青年!!18 小时前
Flutter跨平台开发适配OpenHarmony:下拉刷新组件的实战优化与深度解析
flutter·harmonyos·鸿蒙
行者9620 小时前
Flutter适配OpenHarmony:个人中心
flutter·harmonyos·鸿蒙
行者9621 小时前
Flutter & OpenHarmony跨平台开发实现文件管理器
flutter·harmonyos·鸿蒙
kirk_wang1 天前
Flutter device_info_plus库在鸿蒙端的设备信息获取适配实践
flutter·移动开发·跨平台·arkts·鸿蒙
行者961 天前
Flutter适配OpenHarmony:跨平台开发热门标签组件,从数据到交互的完整实现
前端·flutter·harmonyos·鸿蒙
小雨下雨的雨1 天前
Flutter鸿蒙共赢——色彩的流变:流体梯度网格与现代视觉重构
算法·flutter·华为·重构·交互·harmonyos·鸿蒙
小学生波波1 天前
HarmonyOS6 - 路由组件router和组件导航Navigation
鸿蒙·鸿蒙系统·鸿蒙开发·harmonyos6
小雨下雨的雨1 天前
Flutter鸿蒙共赢——墨染算法:柏林噪声与鸿蒙生态中的数字水墨意境
算法·flutter·华为·交互·harmonyos·鸿蒙
奋斗的小青年!!1 天前
鸿蒙使用Flutter粒子效果实战
flutter·harmonyos·鸿蒙
行者961 天前
Flutter与OpenHarmony跨平台分享组件深度实践
flutter·harmonyos·鸿蒙