HarmonyOS 鸿蒙Next使用Navigation导航进行路由跳转时的步骤及注意事项

最近使用了Navigation进行导航路由跳转，对导航路由的跳转进行总结：

1.在项目的profile文件夹下新建一个router_map.json5的文件，json5文件内容可参照官方链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-navigation-navigation-V5#系统路由表

2.在所属模块的module.json5中，配置{“routerMap”: “$profile:route_map”}

3.本次是从A页面跳转到B页面，其中A页面的布局根节点为Navigation，B页面的布局根节点为NavDestination。Navigation路由跳转，其实就是从Navigation的主页面跳转到NavDestination子页面，如果B页面不是这样的根节点布局，B页面显示为空白。

4.Navigation路由跳转都是基于页面栈NavPathStack提供的方法进行，每个Navigation都需要创建并传入一个NavPathStack对象，用于管理页面。主要涉及页面跳转、页面返回、页面替换、页面删除、参数获取、路由拦截等功能。官方链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-navigation-navigation-V5#路由操作

5.现在实现A页面的跳转核心代码：

@Consume(‘makePathStack’) makePathStack: NavPathStack;

Navigation(this.makePathStack){
…页面布局代码
}.hideTitleBar(true)
.mode(NavigationMode.Stack)

this.makePathStack.pushPathByName(“makephotoviewpage”,item)

6.现在实现B页面的参数接收

@Consume(‘makePathStack’) makePathStack: NavPathStack;

let makelist:String = JSON.stringify(this.makePathStack.getParamByName(‘makephotoviewpage’))

let makestring = JSON.parse(makelist);

本内容仅做经验分享，是初学者进行学习的一个思路，可以多看下官方给的文档

组件导航 (Navigation) (推荐)-设置组件导航和页面路由-UI开发 (ArkTS声明式开发范式)-ArkUI（方舟UI框架）-应用框架 | 华为开发者联盟 (huawei.com)