自学鸿蒙HarmonyOS的ArkTS语言<三>路由跳转及传参

【官方文档传送门】

一、导入模块
java 复制代码
import router from '@ohos.router'
二、新增页面配置
三、常用api

1、跳转到应用内的指定页面

java 复制代码
build() {
    Row() {
      Button('下一页')
          .onClick(() => {
            router.pushUrl({
              url: 'pages/Index2',
              params: {
                name: 'test'
              }
            })
          })
    }
    .height('100%')
  }

2、用应用内的某个页面替换当前页面,并销毁被替换的页面

router.replaceUrl({ url, params: {...} })

java 复制代码
build() {
    Row() {
      Button('下一页')
        .onClick(() => {
          router.replaceUrl({
            url: 'pages/Index2',
            params: {
              name: 'test'
            }
          })
        })
    }
    .height('100%')
  }

3、返回上一页面或指定的页面

java 复制代码
build() {
    Row() {
      Button('返回')
        .onClick(() => {
          router.back()
          // or
          router.back({
             url: '....'
		  })
        })
    }
    .height('100%')
  }

4、清空页面栈中的所有历史页面,仅保留当前页面作为栈顶页面。

java 复制代码
router.clear()

5、获取当前在页面栈内的页面数量

java 复制代码
router.getLength()

6、获取当前页面的状态信息

java 复制代码
router.getState()

7、获取url传参

注意:这里的参数key必须用 'xx' , 不能写成 .xx , 否则报如下错:

相关推荐
xq952714 小时前
ArkTS Component Generator 插件横空出世
harmonyos
Fate_I_C15 小时前
Capacitor 插件鸿蒙化实战:@capacitor/device 从安装到模拟器验证全记录
华为·harmonyos
2501_9197490320 小时前
华为鸿蒙免费记账与生活统计APP—小羊统计
华为·生活·harmonyos·鸿蒙
Fate_I_C20 小时前
Capacitor 应用鸿蒙化实战:用 hionic 把 React 应用跑在 OpenHarmony 上
react.js·华为·harmonyos
SuperHeroWu720 小时前
华为云码道接入 DevEco CLI 鸿蒙应用开发AICoding
华为·华为云·harmonyos
ChinaDragonDreamer21 小时前
HarmonyOS:User Authentication Kit简介
华为·harmonyos
m0_7381858221 小时前
Flutter 鸿蒙化实战:qrcode_flutter 适配 OpenHarmony,二维码生成与识别
数码相机·flutter·华为·harmonyos·鸿蒙
万物智能信息科技21 小时前
血氧心跳传感器MAX30100芯片驱动开发—【万物智能之开源鸿蒙OpenHarmony系统实战开发系列教程】
人工智能·驱动开发·华为·开源·harmonyos·鸿蒙
老陈说编程21 小时前
1. 鸿蒙 (HarmonyOS) 2012 至 2026 年的发展历程
分布式·华为·个人开发·harmonyos·鸿蒙·鸿蒙系统·程序员创富