当前位置: 首页 > news >正文

HarmonyOS NEXT应用开发之动态路由

介绍

本示例将介绍如何使用动态路由跳转到模块中的页面,以及如何使用动态import的方式加载模块

使用说明

  1. 通过动态import的方式,在需要进入页面时加载对应的模块。
  2. 配置动态路由,通过WrapBuilder接口,动态创建页面并跳转。
  3. 动态import变量表达式,需要DevEco Studio NEXT Developer Preview1 (4.1.3.500)版本IDE,配合hvigor 4.0.2版本使用。
  4. 支持自定义路由栈管理,相关内容请参考路由来源页的相关说明

实现思路

动态路由的实现

  1. 注册路由
public static createNavPathStack(router: NavPathStack): void {DynamicsRouter.navPathStack = router;
}
  1. 获取路由
private static getNavPathStack(): NavPathStack {return DynamicsRouter.navPathStack;
}
  1. 通过builderName,注册WrappedBuilder对象,用于动态创建页面
private static registerBuilder(builderName: string, builder: WrappedBuilder<[object]>): void {DynamicsRouter.builderMap.set(builderName, builder);
}
  1. 通过builderName,获取注册的WrappedBuilder对象
public static getBuilder(builderName: string): WrappedBuilder<[object]> {let builder = DynamicsRouter.builderMap.get(builderName);if (!builder) {let msg = "not found builder";console.info(msg + builderName);}return builder as WrappedBuilder<[object]>;
}
  1. 通过页面栈跳转到指定页面
public static async push(routerInfo: RouterInfo, param?: string): Promise<void> {const pageName: string = routerInfo.pageName;const moduleName: string = routerInfo.moduleName;let isImportSucceed: boolean = false;await import(moduleName).then((result: ESObject) => {result.harInit(pageName);isImportSucceed = true;}, (error: ESObject) => {logger.error(LOGGER_TAG, error);});if (isImportSucceed) {const builderName: string = moduleName + "/" + pageName;DynamicsRouter.getNavPathStack().pushPath({ name: builderName, param: param });}
}
  1. 注册动态路由跳转的页面信息
public static registerRouterPage(routerInfo: RouterInfo, wrapBuilder: WrappedBuilder<[object]>) {let builderName: string = routerInfo.moduleName + "/" + routerInfo.pageName;if (!DynamicsRouter.getBuilder(builderName)) {DynamicsRouter.registerBuilder(builderName, wrapBuilder);}
}

动态路由的使用

下面以eventpropagation模块举例说明如何使用动态路由加载子模块页面。

  1. 在工程的根目录的build-profile.json5中添加动态路由模块和需要加载的子模块的依赖,详细代码参考build-profile.json5。
{"app":{...}"modules":{...{"name": "eventpropagation","srcPath": "./feature/eventpropagation"},{"name": "routermodule","srcPath": "./feature/routermodule"}...}
}
  1. 在主模块中添加动态路由和需要加载的子模块的依赖,详细代码请参考oh-package.json。
"dependencies": {"@ohos/dynamicsrouter": "file:../../feature/routermodule",    "@ohos/event-propagation": "file:../../feature/eventpropagation",...
}
  1. 在主模块中添加动态import变量表达式需要的参数,此处在packages中配置的模块名必须和oh-package.json中配置的名称相同,详细代码请参考build-profile.json5。
...
"buildOption": {"arkOptions": {"runtimeOnly": {"packages": ["@ohos/event-propagation",...]}}
}
  1. 在routermodule模块中添加动态路由跳转的moduleName(模块名)和pageName(页面名),RouterInfo中配置的moduleName必须和oh-package.json中配置的名称相同,RouterInfo中添加的pageName是子模块中需要加载的页面,详细代码请参考RouterInfo.ets。
export class RouterInfo {moduleName: string = '';pageName: string = '';constructor(moduleName: string, pageName: string) {this.moduleName = moduleName;this.pageName = pageName;}...static readonly EVENT_TRANSMISSION_SOLUTION: RouterInfo = new RouterInfo('@ohos/event-propagation', 'EventPropagation');...
}
  1. 在主模块中注册路由,并添加页面信息,详细代码请参考EntryView.ets。
...
@Provide('pageStack') pageStack: NavPathStack = new NavPathStack();
@State listData: SceneModuleInfo[] = waterFlowData;
...
aboutToAppear(): void {DynamicsRouter.createNavPathStack(this.pageStack);...
}
...
  1. 在主模块的WaterFlowData.ets中,将子模块要加载的页面,添加到列表中,详细代码请参考WaterFlowData.ets。
export const waterFlowData: SceneModuleInfo[] = [...new SceneModuleInfo($r("app.media.event_propagation"), '阻塞事件冒泡', RouterInfo.EVENT_TRANSMISSION_SOLUTION, '其他', 1),...
}
  1. 在需要加载时将页面放入路由栈,详细代码请参考FunctionalScenes.ets。
@Builder
methodPoints(listData: ListData) {Column() {....onClick(() => {DynamicsRouter.push(listData.routerInfo, listData.param);})
}
  1. 在子模块中添加动态路由的依赖,详细代码可参考oh-package.json。
...
"dependencies": {..."@ohos/dynamicsrouter": "file:../../feature/routermodule"
}
  1. 在子模块中添加动态加载页面组件的接口harInit,其中pageName和RouterInfo中配置的pageName相同,import()接口中传入的参数,是页面的相对路径。详细代码可参考Index.ets。 如果模块中有多个页面需要跳转,则需要配置多个pageName和页面路径,并且pageName和页面路径需要一一对应,否则无法跳转到预期中的页面,可参考barchart模块中的Index.ets文件。
export function harInit(pageName: string) {switch (pageName) {case RouterInfo.EVENT_TRANSMISSION_SOLUTION.pageName:import('./src/main/ets/view/EventPropagation');break;}
}
  1. 在子模块中添加动态创建组件的方法,并注册到动态路由中,详细代码可参考EventPropagation.ets。
...
@Builder
export function getEventPropagation(): void {EventPropagation();
}DynamicsRouter.registerRouterPage(RouterInfo.EVENT_TRANSMISSION_SOLUTION, wrapBuilder(getEventPropagation));
  1. 如果7中设置的router.param是非空的,需要给10中的@Buidler接口添加参数,否则会报错,详细代码请参考NavigationParameterTransferView。
...
@Builder
export function getNavigationParameterTransferView(param: ESObject): void {NavigationParameterTransferView();
}
...
  1. 子模块中的两个页面需要使用动态路由进行跳转时,则不需要执行6,即不需要将页面添加到首页数据中。

高性能知识点

本示例使用动态import的方式加载模块,只有需要进入页面时才加载对应的模块,减少主页面启动时间和初始化效率,减少内存的占用。

工程结构&模块类型

routermodule                                  // har类型
|---constants
|   |---RouterInfo.ets                        // 路由信息类,用于配置动态路由跳转页面的名称和模块名
|---router
|   |---DynamicsRouter.ets                    // 动态路由实现类

模块依赖

不涉及

参考资料

动态路由Sample

为了能让大家更好的学习鸿蒙(HarmonyOS NEXT)开发技术,这边特意整理了《鸿蒙开发学习手册》(共计890页),希望对大家有所帮助:https://qr21.cn/FV7h05

《鸿蒙开发学习手册》:

如何快速入门:https://qr21.cn/FV7h05

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. ……

开发基础知识:https://qr21.cn/FV7h05

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

基于ArkTS 开发:https://qr21.cn/FV7h05

  1. Ability开发
  2. UI开发
  3. 公共事件与通知
  4. 窗口管理
  5. 媒体
  6. 安全
  7. 网络与链接
  8. 电话服务
  9. 数据管理
  10. 后台任务(Background Task)管理
  11. 设备管理
  12. 设备使用信息统计
  13. DFX
  14. 国际化开发
  15. 折叠屏系列
  16. ……

鸿蒙开发面试真题(含参考答案):https://qr18.cn/F781PH

鸿蒙开发面试大盘集篇(共计319页):https://qr18.cn/F781PH

1.项目开发必备面试题
2.性能优化方向
3.架构方向
4.鸿蒙开发系统底层方向
5.鸿蒙音视频开发方向
6.鸿蒙车载开发方向
7.鸿蒙南向开发方向

腾讯T10级高工技术,安卓全套VIP课程全网免费送:https://qr21.cn/D2k9D5

相关文章:

HarmonyOS NEXT应用开发之动态路由

介绍 本示例将介绍如何使用动态路由跳转到模块中的页面&#xff0c;以及如何使用动态import的方式加载模块 使用说明 通过动态import的方式&#xff0c;在需要进入页面时加载对应的模块。配置动态路由&#xff0c;通过WrapBuilder接口&#xff0c;动态创建页面并跳转。动态i…...

wayland(xdg_wm_base) + egl + opengles 使用 Assimp 加载带光照信息的材质文件Mtl 实现光照贴图的最简实例(十七)

文章目录 前言一、3d 立方体 model 属性相关文件1. cube1.obj2. cube1.Mtl3. 纹理图片 cordeBouee4.jpg二、实现光照贴图的效果1. 依赖库和头文件1.1 assimp1.2 stb_image.h2. egl_wayland_obj_cube1.cpp3. Matrix.h 和 Matrix.cpp4. xdg-shell-client-protocol.h 和 xdg-shell…...

【NLP笔记】Transformer

文章目录 基本架构EmbeddingEncoderself-attentionMulti-Attention残差连接LayerNorm DecoderMask&Cross Attention线性层&softmax损失函数 论文链接&#xff1a; Attention Is All You Need 参考文章&#xff1a; 【NLP】《Attention Is All You Need》的阅读笔记 一…...

【Unity】程序创建Mesh(二)MeshRenderer、光照、Probes探针、UV信息、法线信息

文章目录 接上文MeshRenderer&#xff08;网格渲染器&#xff09;Materials&#xff08;材质&#xff09;Material和Mesh对应Lighting光照Lightmapping材质中的光照 光源类型阴影全局光照Probes&#xff08;探针&#xff09;Ray Tracing&#xff08;光线追踪&#xff09;Additi…...

每日一练:LeeCode-167. 两数之和 II - 输入有序数组【双指针】

给你一个下标从 1 开始的整数数组 numbers &#xff0c;该数组已按 非递减顺序排列 &#xff0c;请你从数组中找出满足相加之和等于目标数 target 的两个数。如果设这两个数分别是 numbers[index1] 和 numbers[index2] &#xff0c;则 1 < index1 < index2 < numbers.…...

性能优化(CPU优化技术)-NEON指令详解

原文来自ARM SIMD 指令集&#xff1a;NEON 简介 &#x1f3ac;个人简介&#xff1a;一个全栈工程师的升级之路&#xff01; &#x1f4cb;个人专栏&#xff1a;高性能&#xff08;HPC&#xff09;开发基础教程 &#x1f380;CSDN主页 发狂的小花 &#x1f304;人生秘诀&#xf…...

服务器硬件基础知识和云服务器的选购技巧

概述 服务器硬件基础知识涵盖了构成服务器的关键硬件组件和技术&#xff0c;这些组件和技术对于服务器的性能、稳定性和可用性起着至关重要的作用。其中包括中央处理器&#xff08;CPU&#xff09;作为服务器的计算引擎&#xff0c;内存&#xff08;RAM&#xff09;用于数据临…...

深度学习PyTorch 之 transformer-中文多分类

transformer的原理部分在前面基本已经介绍完了&#xff0c;接下来就是代码部分&#xff0c;因为transformer可以做的任务有很多&#xff0c;文本的分类、时序预测、NER、文本生成、翻译等&#xff0c;其相关代码也会有些不同&#xff0c;所以会分别进行介绍 但是对于不同的任务…...

STC 51单片机烧录程序遇到一直检测单片机的问题

准备工作 一&#xff0c;需要一个USB-TTL的下载器 &#xff0c;并安装好对应的驱动程序 二、对应的下载软件&#xff0c;stc软件需要官方的软件&#xff08;最好是最新的&#xff0c;个人遇到旧的下载软件出现问题&#xff09; 几种出现一直检测的原因 下载软件图标&#xf…...

后端系统开发之——接口参数校验

今天难得双更&#xff0c;大家点个关注捧个场 原文地址&#xff1a;后端系统开发之——接口参数校验 - Pleasure的博客 下面是正文内容&#xff1a; 前言 在上一篇文章中提到了接口的开发&#xff0c;虽然是完成了&#xff0c;但还是缺少一些细节——传入参数的校验。 即用户…...

IDEA 配置阿里规范检测

IDEA中安装插件 配置代码风格检查规范 使用代码风格检测 在代码类中&#xff0c;右键 然后会给出一些不符合规范的修改建议&#xff1a; 保存代码时自动格式化代码 安装插件&#xff1a; 配置插件&#xff1a;...

数据仓库系列总结

一、数据仓库架构 1、数据仓库的概念 数据仓库&#xff08;Data Warehouse&#xff09;是一个面向主题的、集成的、相对稳定的、反映历史变化的数据集合&#xff0c;用于支持管理决策。 数据仓库通常包含多个来源的数据&#xff0c;这些数据按照主题进行组织和存储&#x…...

gitlab runner没有内网的访问权限应该怎么解决

如果你的GitLab Runner没有内网访问权限&#xff0c;但你需要访问内部资源&#xff08;如私有仓库或其他服务&#xff09;&#xff0c;你可以考虑以下几种方法&#xff1a; VPN 或 SSH 隧道&#xff1a; 在允许的情况下&#xff0c;通过VPN或SSH隧道连接到内部网络。这将允许Gi…...

el-tree 设置默认展开指定层级

el-tree默认关闭所有选项&#xff0c;但是有添加或者编辑删除的情况下&#xff0c;需要刷新接口&#xff0c;此时会又要关闭所有选项&#xff1b; 需求&#xff1a;在编辑时、添加、删除 需要将该内容默认展开 <el-tree :default-expanded-keys"expandedkeys":da…...

python便民超市管理系统flask-django-nodejs-php

随着人们生活节奏的加快&#xff0c;以前传统的购物方式发生了巨大的改变&#xff0c;以前一个超市要想经营好自己的门店&#xff0c;每天都要忙着记账出账&#xff0c;尤其是出库入库统计&#xff0c;如果忙中出乱&#xff0c;可能导致今天所有的营业流水&#xff0c;要重新换…...

HarmonyOS — BusinessError 不能被 JSON.stringify转换

在鸿蒙中BusinessError 继承于Error&#xff0c;而在JavaScript&#xff08;以及TypeScript&#xff0c;因为它是JavaScript的超集&#xff09;中&#xff0c;Error 对象包含一些不能被 JSON.stringify 直接序列化的属性。JSON.stringify 方法会将一个JavaScript对象或者值转换…...

JupyterNotebook 如何切换使用的虚拟环境kernel

在Jupyter Notebook中&#xff0c;如果需要修改使用的虚拟环境Kernel&#xff1a; 首先&#xff0c;需要确保虚拟环境已经安装conda上【conda基本操作】 打开Jupyter Notebook。 在Jupyter Notebook的顶部菜单中&#xff0c;选择 “New” 在弹出的窗口中&#xff0c;列出了…...

预防GPT-3和其他复杂语言模型中的“幻觉”

标题&#xff1a;预防GPT-3和其他复杂语言模型中的“幻觉” 正文&#xff1a; “假新闻”的一个显著特征是它经常在事实正确信息的环境中呈现虚假信息&#xff0c;通过一种文学渗透的方式&#xff0c;使不真实的数据获得感知权威&#xff0c;这是半真半假力量令人担忧的展示。…...

从源码解析AQS

前置概念 要彻底了解AQS的底层实现就必须要了解一下线程相关的知识。 包括voliatevoliate 我们使用翻译软件翻译一下volatile&#xff0c;会发现它有以下几个意思&#xff1a;易变的;无定性的;无常性的;可能急剧波动的;不稳定的;易恶化的;易挥发的;易发散的。这也正式使用vola…...

基于Spring Boot的云上水果超市的设计与实现

摘 要 伴随着我国社会的发展&#xff0c;人民生活质量日益提高。于是对云上水果超市进行规范而严格是十分有必要的&#xff0c;所以许许多多的信息管理系统应运而生。此时单靠人力应对这些事务就显得有些力不从心了。所以本论文将设计一套云上水果超市&#xff0c;帮助商家进行…...

后进先出(LIFO)详解

LIFO 是 Last In, First Out 的缩写&#xff0c;中文译为后进先出。这是一种数据结构的工作原则&#xff0c;类似于一摞盘子或一叠书本&#xff1a; 最后放进去的元素最先出来 -想象往筒状容器里放盘子&#xff1a; &#xff08;1&#xff09;你放进的最后一个盘子&#xff08…...

Keil 中设置 STM32 Flash 和 RAM 地址详解

文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面(Target 选项卡)1. IROM1(用于配置 Flash)2. IRAM1(用于配置 RAM)二、链接器设置界面(Linker 选项卡)1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数(如果没有勾选上面…...

在Ubuntu中设置开机自动运行(sudo)指令的指南

在Ubuntu系统中&#xff0c;有时需要在系统启动时自动执行某些命令&#xff0c;特别是需要 sudo权限的指令。为了实现这一功能&#xff0c;可以使用多种方法&#xff0c;包括编写Systemd服务、配置 rc.local文件或使用 cron任务计划。本文将详细介绍这些方法&#xff0c;并提供…...

TRS收益互换:跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 &#xff08;一&#xff09;概念解析 TRS&#xff08;Total Return Swap&#xff09;收益互换是一种金融衍生工具&#xff0c;指交易双方约定在未来一定期限内&#xff0c;基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

前端开发面试题总结-JavaScript篇(一)

文章目录 JavaScript高频问答一、作用域与闭包1.什么是闭包&#xff08;Closure&#xff09;&#xff1f;闭包有什么应用场景和潜在问题&#xff1f;2.解释 JavaScript 的作用域链&#xff08;Scope Chain&#xff09; 二、原型与继承3.原型链是什么&#xff1f;如何实现继承&a…...

NLP学习路线图(二十三):长短期记忆网络(LSTM)

在自然语言处理(NLP)领域,我们时刻面临着处理序列数据的核心挑战。无论是理解句子的结构、分析文本的情感,还是实现语言的翻译,都需要模型能够捕捉词语之间依时序产生的复杂依赖关系。传统的神经网络结构在处理这种序列依赖时显得力不从心,而循环神经网络(RNN) 曾被视为…...

成都鼎讯硬核科技!雷达目标与干扰模拟器,以卓越性能制胜电磁频谱战

在现代战争中&#xff0c;电磁频谱已成为继陆、海、空、天之后的 “第五维战场”&#xff0c;雷达作为电磁频谱领域的关键装备&#xff0c;其干扰与抗干扰能力的较量&#xff0c;直接影响着战争的胜负走向。由成都鼎讯科技匠心打造的雷达目标与干扰模拟器&#xff0c;凭借数字射…...

【HTTP三个基础问题】

面试官您好&#xff01;HTTP是超文本传输协议&#xff0c;是互联网上客户端和服务器之间传输超文本数据&#xff08;比如文字、图片、音频、视频等&#xff09;的核心协议&#xff0c;当前互联网应用最广泛的版本是HTTP1.1&#xff0c;它基于经典的C/S模型&#xff0c;也就是客…...

基于Java+MySQL实现(GUI)客户管理系统

客户资料管理系统的设计与实现 第一章 需求分析 1.1 需求总体介绍 本项目为了方便维护客户信息为了方便维护客户信息&#xff0c;对客户进行统一管理&#xff0c;可以把所有客户信息录入系统&#xff0c;进行维护和统计功能。可通过文件的方式保存相关录入数据&#xff0c;对…...

Proxmox Mail Gateway安装指南:从零开始配置高效邮件过滤系统

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐&#xff1a;「storms…...