【HarmonyOS 鸿蒙实战开发】全局自定义组件复用实现案例

往期知识点整理

• 鸿蒙（HarmonyOS）北向开发知识点记录~
• 【鸿蒙实战开发】基于Navigation的路由拦截管理
• 【鸿蒙实战开发】基于组件嵌套的滑动
• 【鸿蒙实战开发】基于Text的自定义字体
• 【鸿蒙实战开发】基于Grid实现混合布局
• 【鸿蒙实战开发】基于ArkUI实现类似Toast弹窗
• 【鸿蒙实战开发】基于短距离通信的BLE蓝牙扫描
• 【鸿蒙实战开发】HiLog日志能力介绍
• 【鸿蒙实战开发】基于HiAppEvent能力的应用崩溃监控上报
• 【鸿蒙实战开发】基于Refresh组件的下拉刷新
• 【鸿蒙实战开发】混合开发-web组件入门和实战
• 【HarmonyOS 鸿蒙实战开发】NavDestination弹窗
• 【HarmonyOS 鸿蒙实战开发】全局自定义组件复用实现案例
• 持续更新中……

介绍

本示例是 全局自定义组件复用实现 的示例代码，主要讲解如何通过BuilderNode创建全局的自定义组件复用池，实现跨页面的组件复用。

效果图预览

使用说明

1. 继承NodeController，实现可复用的NodeItem组件。
2. 使用单例模式创建NodePool组件复用池，根据传入的type类型查找复用池中是否存在可复用的组件，如果有则直接使用，如果没有则重新创建。
3. 使用NodeContainer组件占位，从复用池NodePool中获取组件加载到页面中。

实现思路

1. 使用List+Swiper实现Tabs页面切换。

     ...
     Swiper(this.swiperController) {
   
       LazyForEach(this.array, () => {
   
         TabNode()
       }, (title: string) => title)
     }
     ...

2. 继承NodeController，实现makeNode，用于组件的创建或刷新ÿ