【HarmonyOS NEXT】组件化与模块化的理解

一、背景

在鸿蒙开发中,组件和模块两者是属于部分与整体的包含关系,核心是为了实现模块化拆分,组件化复用,让开发更高效,维护更简单。

二、组件 (Component)

2.1、是什么?

由@Component装饰的结构体(ArkTS),每个组件通过对数据和方法的简单封装,实现独立的可视、可交互功能单元。组件之间相互独立,随取随用,也可以在需求相同的地方重复使用。

2.2、目的

解决 "UI / 功能重复开发" 问题,解耦应用功能,实现UI能力复用与独立管理

如:一个UI块出现 ≥ 2 的场景,就可以考虑UI组件的封装

2.3、怎么用

举例:我这个轮播图的UI效果在2个组件中都有使用到,这种属于UI/功能重复的开发,可以考虑封装公共的UI组件,在组件内书写UI,具体界面与能力由需求方实现

第一步:封装公共轮播图组件

第二步:页面内使用

三、模块 (Module)

3.1、是什么?

模块是按业务或功能划分的独立代码目录,一个模块对应一个功能的完整代码、资源、配置和依赖的集合,可以被独立编译、测试和部署

3.2、目的

解决 "代码混乱、协作困难" 问题,实现工程的解耦、团队并行开发、功能复用,并优化编译速度

3.3、怎么用

参考我写的这篇文章,关于模块的使用有两种方式👇

https://blog.csdn.net/weixin_71403100/article/details/155428242?spm=1001.2014.3001.5502

四、两者的关系

两者是属于部分与整体的包含关系,一个模块内(特别是Entry/Feature HAP)可以包含一个或多个组件;一个组件 必须存在于某个模块中,模块是组件的容器和载体

五、两者的区别对比

对比项 组件(Component) 模块(Module)
大小 最小(单个 UI / 功能单元) 较大(一组相关功能集合)
核心作用 复用 UI 和独立逻辑 拆分业务、独立维护、跨项目复用
存在形式 单个.ets文件(@Component装饰) 独立目录(含组件、页面、资源等)
配置文件 无需单独配置 必须有build-profile.json5等
编译方式 随模块一起编译 可独立编译、打包成 HAR 包
相关推荐
熊猫钓鱼>_>1 小时前
从2D平铺到3D沉浸:我用HarmonyOS 7端侧AI做了一个全程数据不出设备的空间化私密相册
前端·人工智能·3d·华为·华为云·harmonyos·鸿蒙
m0_738185821 小时前
Flutter 鸿蒙化实战:foundation_fluttify 适配 OpenHarmony,Fluttify 桥接层
flutter·华为·harmonyos·鸿蒙
m0_738185821 小时前
Flutter 鸿蒙化实战:http_proxy 适配 OpenHarmony,HTTP 代理
flutter·http·华为·harmonyos·鸿蒙
m0_738185822 小时前
Flutter 鸿蒙化实战:headset_connection_event 适配 OpenHarmony,耳机插拔监听
flutter·华为·harmonyos·鸿蒙
500842 小时前
React Native for OpenHarmony 实战:三方库 react-native-volume-control 的鸿蒙化适配指南
javascript·react native·react.js·electron·harmonyos
李游Leo16 小时前
HarmonyOS 7 DualCart 平行视界适配实录 04:EasyGo × 虚拟容器:商品比价双详情与分栏比例策略【鸿蒙心迹】
华为·harmonyos
李游Leo16 小时前
HarmonyOS 7 PixelBridge 原生库适配实录 06:Release 性能基线、资源释放、包体积与工程化验收【鸿蒙心迹】
华为·harmonyos
传奇开心果编程17 小时前
【ArkUI进阶练中学】第11课:安全与合规进阶
学习·ui·华为·harmonyos
熊猫钓鱼>_>18 小时前
Kotlin Multiplatform for OpenHarmony 实战:为 Reaktive 实现响应式原语适配(完整版 · 含摘要目录与技术图表)
华为·kotlin·大模型·ai编程·harmonyos·适配·reaktive
李游Leo21 小时前
HarmonyOS 7 + Spatial Recon Kit-C++:3DGS 高斯参数的非有限值隔离与可渲染性门禁【鸿蒙心迹】
开发语言·c++·3d·harmonyos