从 Router 到 Navigation:HarmonyOS 路由框架的全面升级与迁移指南

在本教程中,我们深入探讨了 Router 和 Navigation 在 HarmonyOS 中的用法差异及如何从 Router 切换到 Navigation 的方法。重点涵盖了页面跳转、转场动画、生命周期管理以及跨包路由的实现。

页面结构对比
Router 页面结构
每个页面需要使用 @Entry 注解。
页面需要在 main_page.json 中进行注册。
示例代码:

// main_page.json
{"src": ["pages/Index","pages/pageOne","pages/pageTwo"]
}

Router 页面示例:

@Entry
@Component
struct Index {build() {Button('Navigate to PageOne').onClick(() => {router.pushUrl({ url: 'pages/pageOne' });});}
}

Navigation 页面结构
基于组件化的设计。
需要一个 NavPathStack 对象来管理页面栈。
子页面通过 NavDestination 进行注册。
示例代码:

@Entry
@Component
struct Index {pathStack: NavPathStack = new NavPathStack();build() {Navigation(this.pathStack) {Button('Push PageOne').onClick(() => this.pathStack.pushPathByName('pageOne'));}.title("Navigation");}
}

路由操作对比
在这里插入图片描述

生命周期管理
Router 生命周期
Router 页面依赖全局生命周期方法,主要包括:

aboutToAppear()
onPageShow()
aboutToDisappear()
onPageHide()
Navigation 生命周期
Navigation 生命周期基于 NavDestination 组件,提供了更多粒度的生命周期方法,如:

onWillAppear()
onAppear()
onWillDisappear()
onDisAppear()
动画支持
Router 转场动画
Router 提供系统预设和自定义动画,支持 sharedTransition 实现共享元素转场。

Navigation 转场动画
Navigation 内置转场动画机制,可通过 customNavContentTransition 自定义切换效果。同时支持通过 geometryTransition 属性实现共享元素转场。

跨包路由
Router 跨包路由
通过 @Entry 注解的 routeName 属性实现命名路由,并在主页面引入目标页面的路径。

示例代码:

import('library/src/main/ets/pages/Index');router.pushNamedRoute({ name: 'myPage', params: { key: 'value' } });

Navigation 跨包路由
Navigation 内置支持跨包跳转,目标页面在子包中声明为 export 后,直接在 Navigation 中注册。

总结
Router 更适合简单的页面跳转需求,而 Navigation 提供了更丰富的栈操作、动画自定义和组件化管理能力。如果项目需要跨包跳转或复杂的页面管理,建议迁移至 Navigation 体系。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/889742.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【工具】linux matlab 的使用

问题1 - 复制图表 在使用linux matlab画图后,无法保存figure。 例如在windows下 但是在linux下并没有这个“Copy Figure”的选项。 这是因为 “ The Copy Figure option is not available on Linux systems. Use the programmatic alternative.” 解决方案&…

windows11 专业版 docker desktop 安装指南

家庭中文版需升级专业版,家庭版没有hyper-v。 开始运行optionalfeatures.exe打开windows功能 安装wsl2 步骤 1 - 启用适用于 Linux 的 Windows 子系统步骤 2 - 检查运行 WSL 2 的要求步骤 3 - 启用虚拟机功能步骤 4 - 下载 Linux 内核更新包 步骤 1 - 启用适用于 L…

工业大数据分析算法实战-day01

文章目录 前言day01工业上刻画物理世界模型忽略业务的数据挖掘是本末倒置数据分析算法的朴素思想 前言 从毕业后从事的行业是机房动力环境运维行业,职责为动环设备的监控预警和故障诊断,核心主旨为动环设备的数智化,个人浅见从大类视角来看隶…

bug:uniapp运行到微信开发者工具 白屏 页面空白

1、没有报错信息 2、预览和真机调试都能正常显示,说明代码没错 3、微信开发者工具版本已经是win7能装的最高版本了,1.05版 链接 不打算回滚旧版本 4、解决:最后改调试基础库为2.25.4解决了,使用更高版本的都会报错,所…

用 Python 实现经典的 2048 游戏:一步步带你打造属于你的小游戏!

用 Python 实现经典的 2048 游戏:一步步带你打造属于你的小游戏!(结尾附完整代码) 简介 2048 是一个简单而又令人上瘾的数字拼图游戏。玩家通过滑动方块使相同数字的方块合并,目标是创造出数字 2048!在这篇…

【Go】-倒排索引的简单实现

目录 什么是倒排索引 定义 基本结构和原理 分词在倒排索引中的重要性 简单倒排索引的实现 接口定义 简单数据库的实现 倒排索引 正排索引 测试 总结 什么是倒排索引 定义 倒排索引(Inverted Index)是一种索引数据结构,它是文档检…

智汇云舟4个案例入选“中国联通智慧城市物联感知与AI应用案例”

12月10日,由中国联通智慧城市军团联合联通数字科技有限公司物联网事业部、物联中国团体组织联席会共同主办的“中国联通首届智慧城市领域物联感知与AI应用优秀案例发布交流大会”在郑州举行。大会现场对50余个优秀案例进行了集中发布与表彰。智汇云舟凭借深厚的技术…

http 502 和 504 的区别

首先看一下概念: 502:作为网关或者代理工作的服务器尝试执行请求时,从上游服务器接收到无效的响应。503:由于临时的服务器维护或者过载,服务器当前无法处理请求。这个状况是临时的,并且将在一段时间以后恢…

博弈论3:图游戏SG函数(Graph Games)

目录 一、图游戏是什么 1.游戏特征 2.游戏实例 二、图游戏的必胜策略 1.SG 函数(Sprague-Grundy Function) 2.必胜策略(利用SG函数) 3.拿走游戏转化成图游戏(Take-away Game -> Graph Game) 一、图…

免费生成AI PPT产品推荐?

要完全免费几乎是没有的,要知道AI还是非常烧钱的。 不过免费蹭还是有很多方法的,这里收集了一些: 下面分享我自己免费蹭过的几款AI制作PPT的工具。 1 金山-WPS PPT对我们来说并不陌生,而微软的PowerPoint与金山的WPS也是我们最常…

Python机器视觉的学习

一、二值化 1.1 二值化图 二值化图:就是将图像中的像素改成只有两种值,其操作的图像必须是灰度图。 1.2 阈值法 阈值法(Thresholding)是一种图像分割技术,旨在根据像素的灰度值或颜色值将图像分成不同的区域。该方法…

Cisco Packet Tarcer配置计网实验笔记

文章目录 概要整体架构流程网络设备互连基础拓扑图拓扑说明配置步骤 RIP/OSPF混合路由拓扑图拓扑说明配置步骤 BGP协议拓扑图拓扑说明配置步骤 ACL访问控制拓扑图拓扑说明配置步骤 HSRP冗余网关拓扑图拓扑说明配置步骤 小结 概要 一些环境配置笔记 整体架构流程 网络设备互连…

【优选算法】二分算法(在排序数组中查找元素的第一个和最后一个位置,寻找峰值,寻找排序数组中的最小值)

二分算法简介: 提到二分我们可能都会想起二分查找,二分查找要求待查找的数组是有序的,与我们今天讲的二分算法不同,并不是数组元素严格按照有序排列才可以使用二分算法,只要数组中有一个点可以将数组分为两个部分&…

下载与使用PCL启动器(2.8.12正式版)

一.下载PCL启动器 PCL启动器下载官网:爱发电 连接创作者与粉丝的会员制平台将创作的自由还给创作者!爱发电是让创作者简单地获得稳定收入的粉丝赞助平台。无论你在创作什么,都能在这里获得持续的资金支持,让创作从此更自由。htt…

【ArcGIS】基于R语言、MaxEnt模型融合技术的物种分布模拟、参数优化方法、结果分析制图与论文写作

第一章、以问题导入的方式,深入掌握原理基础【理论篇】 1、R语言入门: (1)安装R及集成开发环境(IDE);(2)R语言基础语法与数据结构,包括:程序包安…

泊松编辑 possion editing图像合成笔记

开源地址: GitHub - kono-dada/Reproduction-of-possion-image-editing 掩码必须是矩形框

江科大笔记—DMA数据转运DMA+AD多通道

1. DMA初始化结构体详解 标准库函数对每个外设都建立了一个初始化结构体xxx_InitTypeDef(xxx为外设名称),结构体成员用于设置外设工作参数, 并由标准库函数xxx_Init()调用这些设定参数进入设置外设相应的寄存器,达到配置外设工作环境的目的。…

程序算术题-2

程序算术题-2 输出所有组合逻辑实例代码 输出所有排列逻辑实例代码 输出所有组合 计算一组数字按n位数组合的所有组合。 逻辑 /*** param stringBuilder 用于组合的拼接* param list 组合数序列* param level 目前位数* param exceptedLevel 组合期待位数*/…

MAC M3电脑在idea上搭建Spark环境并跑通第一个程序

我的电脑是Macbook Pro,最近在学习Spark,想要在idea里搭建Spark环境,为之后的Spark编程作准备。下面是在MAC版本的idea里配置Spark环境。 1. 准备工作 1.安装 JDK 确保Mac 上已经安装了 JDK 8 或更高版本。 可通过 java -version 查看是否…

欧科云链研究院:AI时代,如何证明“我是我”?

OKG Research|编辑 近日,OpenAI 发布了新模型 Sora。这是一款高性能的文本到多模态生成工具,支持从文本生成精细的图像和动态视频。 相较早先发布的视频样例,该功能目前已经可以由用户真实上手体验,目前由于服务过载…