鸿蒙系统路由表

准备工作：

        1. 创建鸿蒙项目

        2. 创建分层架构

一、配置features.har/hsp模块

1. 给每个模块创建系统路由表

在resources/base/profile/route_map.json目录下创建 路由配置文件，且填写以下代码

{
  "routerMap": [
    {
      "name": "CartHar/MainPage",    // 路径名
      "pageSourceFile": "src/main/ets/components/MainPage.ets", // 实际的文件位置  
      "buildFunction": "MainPageBuilder",    // 导出的内容
      "data": {
        "description" : "this is PageOne"
      }
    }
  ]
}

2. 让创建的route_map.json生效

修改模块的module.json5文件，在该文件的module内添加"routerMap": "$profile:route_map",

3. 按照系统路由表需要的组件格式修改组件

// 该文件的位置要和第一步pageSourceFile的路径一致
// 导出的名字要和第一步buildFunction的值保持一致
@Builder
export function MainPageBuilder() {  
  MainPage()
}


@Component
struct MainPage { 

  build() {
    NavDestination() { 
      Text('内容').fontSize(30)
    }
    .title('CartHar/MainPage')
    .hideTitleBar(false)
  }
}

二、配置entry(hap)绑定依赖模块

在产品模块 对应的设备下的 oh-package.json5文件中绑定依赖

"dependencies": {
    "引入模块下oh-package.json5对应的name值保持一致": "file:路径"
}

三、跳转

entry.hap -> har/hsp

@Entry
@Component
struct Index {
  @Provide pageStack: NavPathStack = new NavPathStack()
  build() {
    Navigation(this.pageStack){
      Button('跳转har/hsp').onClick(() => this.pageStack.pushPathByName('路径', null))
    }
  }
}

har -> har/hsp

@Builder
export function MainPageBuilder() { 
  MainPage()
}

@Component
struct MainPage {
  @Consume('pageStack') pageStack: NavPathStack
  build() {
    NavDestination() {
      Text('内容').fontSize(30)
      Button('Har -> har/hap').onClick(() => this.pageStack.pushPathByName('路径', null))
    }
    .title('HomeHar/MainPage')
    .hideTitleBar(false)
  }
}