鸿蒙的lazyForeach

import { util } from '@kit.ArkTS';


export default class ArticleListData implements IDataSource {
  private dataArray: WatchListsItemType[];
  private listeners: DataChangeListener[] = [];

  constructor(dataArray: WatchListsItemType[]) {
    this.dataArray = dataArray;
  }

  registerDataChangeListener(listener: DataChangeListener): void {
    if (this.listeners.indexOf(listener) < 0) {
      console.info('add listener');
      this.listeners.push(listener);
    }
  }

  unregisterDataChangeListener(listener: DataChangeListener): void {
    const pos = this.listeners.indexOf(listener);
    if (pos >= 0) {
      console.info('remove listener');
      this.listeners.splice(pos, 1);
    }
  }


  public totalCount(): number {
    return this.dataArray.length;
  }

  public getData(index: number): WatchListsItemType {
    return this.dataArray[index];
  }

  public addData(index: number, data: WatchListsItemType): void {
    this.dataArray.splice(index, 0, data);
    this.notifyDataAdd(index);
  }

  public pushData(data: WatchListsItemType): void {
    this.dataArray.push(data);
    this.notifyDataAdd(this.dataArray.length - 1);
  }

  notifyDataAdd(index: number): void {
    this.listeners.forEach(listener => {
      listener.onDataAdd(index);
    })
  }
}

export class ObservedArray<T> extends Array<T> {
  constructor(args?: T[]) {
    if (args instanceof Array) {
      super(...args);
    } else {
      super();
    }
  }
}


class Constants {

  static readonly FULL_SCREEN: string = '100%';

  static readonly SPACE_16: number = 16;
  static readonly SPACE_12: number = 12;
}



export class WatchListsItemType {
code:string=''
  name:string=''
}
function bufferToString(buffer: ArrayBufferLike): string {
  let textDecoder = util.TextDecoder.create('utf-8', {
    ignoreBOM: true
  });
  let resultPut = textDecoder.decodeWithStream(new Uint8Array(buffer), {
    stream: true
  });
  return resultPut;
}

@Entry
@Component
export struct Index {
  @State collectedIds: ObservedArray<string> = ['1', '2', '3', '4', '5', '6'];
  @State likedIds: ObservedArray<string> = ['1', '2', '3', '4', '5', '6'];
  @State isListReachEnd: boolean = false;
  @State data: ArticleListData | null = null;

  aboutToAppear() {
    this.getArticleModelObjFromJSON();
  }

  aboutToDisappear(): void {
    this.data = null;
  }

  getArticleModelObjFromJSON() {
      let jsonObj : WatchListsItemType[]=  [ {code:'1',name:'1'}, {code:'2',name:'2'}, {code:'3',name:'3'}, {code:'4',name:'4'}, {code:'5',name:'5'}, {code:'6',name:'6'},{code:'7',name:'7'}, {code:'8',name:'8'},{code:'9',name:'9'},{code:'10',name:'10'},{code:'11',name:'11'},{code:'12',name:'12'},{code:'13',name:'13'},{code:'14',name:'14'},{code:'15',name:'15'},{code:'16',name:'16'},{code:'17',name:'17'},{code:'18',name:'18'},{code:'19',name:'19'},{code:'20',name:'20'},{code:'21',name:'21'},{code:'22',name:'22'},{code:'23',name:'23'},{code:'24',name:'24'},{code:'25',name:'25'},{code:'26',name:'26'},{code:'27',name:'27'},{code:'28',name:'28'},{code:'29',name:'29'},{code:'30',name:'30'},{code:'31',name:'31'},{code:'32',name:'32'},{code:'33',name:'33'},{code:'34',name:'34'},{code:'35',name:'35'},{code:'36',name:'36'},{code:'37',name:'37'},{code:'38',name:'38'},{code:'39',name:'39'},{code:'40',name:'40'},{code:'41',name:'41'},{code:'42',name:'42'},{code:'43',name:'43'},{code:'44',name:'44'},{code:'45',name:'45'},{code:'46',name:'46'},{code:'47',name:'47'}]
      let resources: WatchListsItemType[] = [];
      jsonObj.forEach((res: WatchListsItemType) => {
        resources.push(res);
      });
      this.data = new ArticleListData(resources);
  }

  isCollected(resourceId: string): boolean {
    return this.collectedIds.some((id: string) => id === resourceId);
  }

  isLiked(resourceId: string): boolean {
    return this.likedIds.some((id: string) => id === resourceId);
  }


  build() {
    Column() {
      List({ space: Constants.SPACE_16 }) {
        if (this.data !== null) {
          LazyForEach(this.data, (item: WatchListsItemType) => {
            ListItem() {
              Row({ space: Constants.SPACE_12 }) {

                Text(item.code)
                Text(item.name)
              }
            }
            .reuseId('article')
          })
        }
      }
      .width(Constants.FULL_SCREEN)
      .height(Constants.FULL_SCREEN)
      .margin({ left: 10, right: 10 })
      .layoutWeight(1)
      .cachedCount(3);
    }
    .backgroundColor(Color.White)
  }
}