HarmonyOS鸿蒙开发实战（5.0）自定义路由栈管理

鸿蒙HarmonyOS NEXT开发实战往期文章必看（持续更新......）

介绍

本案例将介绍如何使用路由跳转返回时获取到来源页的模块名以及路径名，在实际场景中同一页面通常会根据不同来源页展示不同的UI。

使用说明

无特殊使用说明，其他使用说明参考动态路由的相关说明

实现思路

路由来源页的实现

新增来源页字段

export class DynamicsRouter {
...
// 通过数组实现自定义栈的管理
static routerStack: Array<RouterModel> = new Array();
static referrer: string[] = [];
...
}
注册路由

public static createRouter(router: NavPathStack): void {
DynamicsRouter.navPathStack = router;
// 初始化时来源页为未定义
let homeRouterModule = new RouterModel();
homeRouterModule.routerName = RouterInfo.HOME_PAGE[0];
homeRouterModule.path = RouterInfo.HOME_PAGE[1];
DynamicsRouter.routerStack.push(homeRouterModule)
logger.info(DynamicsRouter create routerStack Home is: ${homeRouterModule.routerName} + ${homeRouterModule.path});
}
获取路由来源页面栈

public static getRouterReferrer(): string[] {
return DynamicsRouter.referrer;
}
通过页面栈跳转到指定页面

public static async push(router: RouterModel): Promise<void> {
const path: string = router.path;
const routerName: string = router.routerName;
let param: string = router.param;
console.info('push', path, routerName);
// TODO：知识点：通过动态import的方式引入模块，在需要进入页面时才加载模块，可以减少主页面的初始化时间及占用的内存
await import(routerName).then(
(ns: ESObject) => {
console.info('harInit');
ns.harInit(path)
},
(ret: ESObject) => {
console.info('import reason', ret);
}
);
// push前记录当前页面的名字
DynamicsRouter.getRouter().pushPath({ name: routerName, param: param });
// 自定义栈也加入指定页面
DynamicsRouter.routerStack.push(router);
let referrerModel: RouterModel = DynamicsRouter.routerStack[DynamicsRouter.routerStack.length - 2];
DynamicsRouter.referrer[0] = referrerModel.routerName;
DynamicsRouter.referrer[1] = referrerModel.path;
logger.info(From DynamicsRouter.routerStack push preview module name is + ${DynamicsRouter.referrer[0]}, path is ${DynamicsRouter.referrer[1]});
}
通过页面栈返回上一页

// 通过获取页面栈并pop
public static pop(): void {
// pop前记录的来源页为当前栈顶
let referrerModel: RouterModel = DynamicsRouter.routerStack[DynamicsRouter.routerStack.length - 1];
DynamicsRouter.referrer[0] = referrerModel.routerName;
DynamicsRouter.referrer[1] = referrerModel.path;
logger.info(From DynamicsRouter.routerStack pop preview module name is + ${DynamicsRouter.referrer[0]}, path is ${DynamicsRouter.referrer[1]});
if (DynamicsRouter.routerStack.length > 1) {
DynamicsRouter.routerStack.pop();
} else {
logger.info("DynamicsRouter.routerStack is only Home.");
}
// 查找到对应的路由栈进行pop
DynamicsRouter.getRouter().pop();
}

路由来源页的使用

在任意模块中使用DynamicsRouter.createRouter()创建路由，在路由创建时会将主页HomePage推入自定义路由栈，并给代表来源页的referrer 字段赋值。
获取路由来源页面栈，执行DynamicsRouter.getRouterStack()获得自定义路由栈，该方法和Navigation的路由栈原理一致，会在push和pop页面跳转之前记录来源页并赋值给referrer。

高性能知识点

不涉及

工程结构&模块类型

routermodule                                  // har类型
|---constants
|   |---RouterConstants.ets                     // 常量类，用于配置动态路由跳转页面的名称和模块路径
|---model
|   |---RouterModel.ets                         // 路由信息类，用于存储路由的相关信息
|---router
|   |---DynamicsRouter.ets                      // 动态路由实现类 + 来源页面

模块依赖

不涉及

参考资料

不涉及

最后

小编在之前的鸿蒙系统扫盲中，有很多朋友给我留言，不同的角度的问了一些问题，我明显感觉到一点，那就是许多人参与鸿蒙开发，但是又不知道从哪里下手，因为体系杂乱无章，教授的人也多，无从选择。有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？而且学习时频繁踩坑，最终浪费大量时间。所以有一份实用的鸿蒙（HarmonyOS NEXT）路线、视频、文档用来跟着学习是非常有必要的。

如果你是一名有经验的资深Android移动开发、Java开发、前端开发、对鸿蒙感兴趣以及转行人员

鸿蒙 NEXT 全栈开发学习笔记希望这一份鸿蒙学习文档能够给大家带来帮助~

这份鸿蒙（HarmonyOS NEXT）包含了鸿蒙开发必掌握的核心知识要点，内容包含了（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、（南向驱动、嵌入式等）鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）技术知识点。

鸿蒙（HarmonyOS NEXT）最新学习路线

该路线图包含基础技能、就业必备技能、多媒体技术、六大电商APP、进阶高级技能、实战就业级设备开发，不仅补充了华为官网未涉及的解决方案

路线图适合人群：

IT开发人员： 想要拓展职业边界
零基础小白： 鸿蒙爱好者，希望从0到1学习，增加一项技能。
**技术提升/进阶跳槽：**发展瓶颈期，提升职场竞争力，快速掌握鸿蒙技术

2.视频教程+学习PDF文档

（鸿蒙语法ArkTS、TypeScript、ArkUI教程......） 全球开发者的开源社区,开源代码

纯血版鸿蒙全套学习文档（面试、文档、全套视频等） 全球开发者的开源社区,开源代码

鸿蒙APP开发必备

总结

参与鸿蒙开发，你要先认清适合你的方向，如果是想从事鸿蒙应用开发方向的话，可以参考本文的学习路径，简单来说就是：为了确保高效学习，建议规划清晰的学习路线