HarmonyOS-路由传参

2025-01-08 约 382 字预计阅读 1 分钟

https://bing.ee123.net/img/rand?artid=135305384

HarmonyOS 路由传参

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

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

其实他还有个params参数

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

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 是一个对象键值对就是我们要传递给下一个界面的参数

我们第二个界面这样写

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 组件

然后点击按钮

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

目录

HarmonyOS-路由传参

HarmonyOS 路由传参