介绍
本示例是全局自定义组件复用实现的示例代码,主要讲解如何通过BuilderNode创建全局的自定义组件复用池,实现跨页面的组件复用。
效果图预览
使用说明
- 继承NodeController,实现可复用的NodeItem组件。
- 使用单例模式创建NodePool组件复用池,根据传入的type类型查找复用池中是否存在可复用的组件,如果有则直接使用,如果没有则重新创建。
- 使用NodeContainer组件占位,从复用池NodePool中获取组件加载到页面中。
实现思路
-
使用List+Swiper实现Tabs页面切换,详细代码请参考BuilderNodePoolDemo.ets。
... Swiper(this.swiperController) { LazyForEach(this.array, () => { TabNode() }, (title: string) => title) } ...
-
继承NodeController,实现makeNode,用于组件的创建或刷新,并在组件隐藏时(aboutToDisappear)回收组件,详细代码请参考BuilderNodePool.ets中的NodeItem实现。
export class NodeItem extends NodeController { private callback: Update