#HarmonyOS NEXT 体验官# HMRouter 使用详解（一）环境配置

踏入鸿蒙世界的敲门砖，标志着您在技术征途上的全新起点，提升就业竞争力，获得行业认可，点亮职业成长先机，快人一步抢占未来应用开发赛道！https://developer.huawei.com/consumer/cn/training/dev-cert-detail/101666948302721398?ha_source=hmosclass-csdn&ha_sourceId=89000445

背景

在项目中使用官方推荐的 Navigation 时，需要在所有的页面上都添加一层 NavDestination，在代码阅读上会增加多个层级，而且还要在主页面设置对应名字的跳转等问题，配置起来比较繁琐。看到大佬开发的 HMRouter 使用起来方便简洁，因此，写下这篇文章记录 HMRouter 的使用。

插件配置

1.HMRouter 安装

在终端中运行下面命令进行第三方库的安装。

2.添加路由编译插件

修改项目的 hvigor/hvigor-config.json 文件中的 dependencies 数组。

3.使用路由编译插件

在项目的 entry/hvigorfile.ts 文件中添加插件的使用。如果模块是 Har 则使用 harPlugin(),模块是 Hsp 则使用 hspPlugin()

4.工程配置

由于拦截器、生命周期和自定义转场动画会在运行时动态创建实例，因此需要进行如下配置，使得 HMRouter 路由框架可以动态导入项目中的模块。

在工程目录下的 build-profile.json5 中，配置 useNormalizedOHMUrl 属性为 true。

HMRouter 使用

在 UIAbility 中初始化路由框架

在 OnCreate 中初始化路由框架。

在首页中定义路由入口

自定义一个 NavModifier 类，继承 AttributeUpdater<NavigationAttribute>

然后编写页面代码

HMNavigation 参数解析

· navigationId :容器 ID 并且全局统一

· homePageUrl：指定默认加载的页面

· navigationOption：全局参数设置。

modifier：Navigation 动态属性设置

standardAnimator：页面全局动画配置

dialogAnimator：弹窗全局动画配置

title：navigation 的 Title 设置

menus：navigation 的 menus 设置

toolbar：navigation 的 toolbar 设置

systemBarStyle：navigation 的 systemBarStyle 设置

页面设置

新建跳转的页面 TwoPage，里面按钮使用 HMRouterMgr.pop 方法实现返回上个页面的操作。必须加上 @HMRouter 装饰器，pageUrl 方法来定义页面的名称

总结

这篇帖子主要关注在 HMRouter 的环境部署和简单的页面跳转。

这里附上 HMRouter 的 Gitee 地址

（转载自 51CTO，作者：奥尼 5354）