ArkTs之:数据懒加载——LazyForEach的用法

官方描述

LazyForEach从提供的数据源中按需迭代数据，并在每次迭代过程中创建相应的组件。当在滚动容器中使用了LazyForEach，框架会根据滚动容器可视区域按需创建组件，当组件滑出可视区域外时，框架会进行组件销毁回收以降低内存占用。

使用限制

• LazyForEach必须在容器组件内使用，仅有List、Grid、Swiper以及WaterFlow组件支持数据懒加载（可配置cachedCount属性，即只加载可视部分以及其前后少量数据用于缓冲），其他组件仍然是一次性加载所有的数据。
• LazyForEach在每次迭代中，必须创建且只允许创建一个子组件。
• 生成的子组件必须是允许包含在LazyForEach父容器组件中的子组件。
• 允许LazyForEach包含在if/else条件渲染语句中，也允许LazyForEach中出现if/else条件渲染语句。
• 键值生成器必须针对每个数据生成唯一的值，如果键值相同，将导致键值相同的UI组件渲染出现问题。
• LazyForEach必须使用DataChangeListener对象进行更新，对第一个参数dataSource重新赋值会异常；dataSource使用状态变量时，状态变量改变不会触发LazyForEach的UI刷新。
• 为了高性能渲染，通过DataChangeListener对象的onDataChange方法来更新UI时，需要生成不同于原来的键值来触发组件刷新。
• LazyForEach必须和@Reusable装饰器一起使用才能触发节点复用。使用方法：将@Reusable装饰在LazyForEach列表的组件上，见使用规则。

实战

LazyForEach是专门用来进行数据懒加载的接口,非常适合大数据量渲染的场景,但是想使用它必须要先实现IDatasource接口才能使用,废话不多说,直接上代码:

//第一步:实现IDataSource接口
// RecommendDataSource.ets
import {
   
    Recommend_Item } from '../DataType/index';
export class RecommendDataSource implements IDataSource {
   
   
  // 数据源
  private recommends: Array<Recommend_Item>;
  // 监听器
  private listeners: DataChangeListener[] = [];

  constructor(data: Recommend_Item[]