学习笔记（四十）：HMRouter简介和配置

概述：

HMRouter作为HarmonyOS的页面跳转场景解决方案，聚焦解决应用内原生页面的跳转逻辑。

HMRouter底层对系统Navigation进行封装，集成了Navigation、NavDestination、NavPathStack的系统能力，

提供了可复用的路由拦截、页面生命周期、自定义转场动画，

并且在跳转传参、额外的生命周期、服务型路由方面对系统能力进行了扩展。

 

特性：

基于注解声明路由信息
注解中页面路径支持使用字符串常量定义
支持Har、Hsp、Hap
支持Navigation路由栈嵌套
支持服务型路由
支持路由拦截器（包含全局拦截、单页面拦截、跳转时一次性拦截）
支持生命周期回调（包含全局生命周期、单页面生命周期、跳转时一次性生命周期、NavBar生命周期）
内置转场动画（页面、Dialog），可配置方向、透明度、缩放，支持交互式转场动画，同时支持配置某个页面的转场动画、跳转时的一次性动画
支持Dialog类型页面、支持单例页面

 

下载安装：

方法一：使用ohpm安装依赖

ohpm install @hadss/hmrouter

方法二：修改oh-package.json5

{
  "dependencies": {
    "@hadss/hmrouter": "^1.0.0-rc.5"
  }
}
或者

"dependencies": { // 三方依赖
  "@hadss/hmrouter": "latest", //最新版本
}

{
  "name": "entry",
  "version": "1.0.0",
  "description": "Please describe the basic information.",
  "main": "",
  "author": "",
  "license": "",
  "dependencies": { // 三方依赖
    "@hadss/hmrouter": "latest",
  }
}

 

使用配置：

一、编译插件配置

①、修改项目的hvigor/hvigor-config.json文件，加入路由编译插件

{
  "modelVersion": "5.0.0",
  "dependencies": {
    "@hadss/hmrouter-plugin": "latest" // 使用最新
  }
}

{
  "modelVersion": "5.0.0",
  "dependencies": {
    "@hadss/hmrouter-plugin": "latest" // 使用最新
  },
  // https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-hvigor-faqs-V5#section119742124315
  // 打开堆栈信息排查hvigorconfig.ts文件和hvigorfile.ts文件里的代码，里面是否使用了未定义的属性。,
  "debugging": {
    "stacktrace": true                /* Disable stacktrace compilation. Value: [ true | false ]. Default: false */
  }
}

 

②、在模块中引入路由编译插件，修改hvigorfile.ts文件

// Script for compiling build behavior. It is built in the build plug-in and cannot be modified currently.
import { hapTasks } from '@ohos/hvigor-ohos-plugin';
import { hapPlugin } from "@hadss/hmrouter-plugin";

export default {
  system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */
  plugins: [hapPlugin()]         /* Custom plugin to extend the functionality of Hvigor. */
}

注：如果模块是Har则使用harPlugin(), 模块是Hsp则使用hspPlugin()

 

二、工程配置

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

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

 

相关文档：

HMRouter简介