HarmonyOS 路由传参

本文 我们来说两个page界面间的数据传递

路由跳转 router.pushUrl 之前我们用了不少了 但是我们只用了它的第一个参数 url

其实他还有个params参数

我们第一个组件可以编写代码如下

typescript 复制代码
import router from '@ohos.router'
@Entry
@Component
struct Index {

  build() {
    Row() {
      Column() {
        Button("跳转").onClick(()=>{
          router.pushUrl({
            url: "pages/AppView",
            params: {
              name: "小猫猫",
              age: 20
            }
          })
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

这里 我们button按钮设置点击事件 调用 router.pushUrl 跳转向 pages/AppView 页面

然后第二个参数 params 是一个对象 键值对 就是我们要传递给下一个界面的参数

我们第二个界面这样写

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

let name:string = router.getParams()["name"]
let age:number = router.getParams()["age"]

@Entry
@Component
struct AppView {
  build() {
    Row() {
      Column(){
        Text(name)
        Text(""+age)
      }
      .width('100%')
    }
    .height('100%')
  }
}

通过 router.getParams 就可以取到上一个界面传过来的值 然后 后面一对数组括号 告诉它你要取哪个字段

然后 我们用text组件展示内容 因为text 不能用数字 所以我们要用 字符串加的方式 将age转存字符串类型的

我们开启预览模式 运行index组件

然后点击按钮

跳转后 第二个界面也就顺利的拿到了传过来的参数

相关推荐
塞尔维亚大汉23 分钟前
鸿蒙内核源码分析(文件句柄篇) | 你为什么叫句柄?
源码·harmonyos
别说我什么都不会27 分钟前
【OpenHarmony】鸿蒙开发之FlexSearch
harmonyos
HarmonyOS小助手2 小时前
在鸿蒙中造梦的开发者,一边回答,一边前行
harmonyos·鸿蒙·harmonyos next·鸿蒙生态
刘阿宾3 小时前
【华为昇腾|CUDA】服务器A6000显卡部署LLM实战记录
服务器·华为·语言模型·gpu算力·kylin
HarmonyOS_SDK4 小时前
用AI重塑游戏体验:《诛仙2》携手HarmonyOS SDK实现性能与功耗双赢
harmonyos
别说我什么都不会5 小时前
【OpenHarmony】鸿蒙开发之epublib
harmonyos
塞尔维亚大汉5 小时前
鸿蒙内核源码分析(VFS篇) | 文件系统和谐共处的基础
源码·harmonyos
RUZHUA5 小时前
华为 Mate 80 影像配置揭秘:硬软双升
华为
Georgewu21 小时前
【HarmonyOS】鸿蒙端云一体化开发入门详解 (一)
harmonyos
Georgewu21 小时前
【HarmonyOS】Web 组件的 PDF 文档预览功能详解
harmonyos