鸿蒙Next--针对LazyForEach 做了个数据封装类

1：基础类 根据文档，需要实现IDataSource接口。

export class BasicDataSource<T> implements IDataSource {
  public dataArray: T[] = [];
  private listeners: DataChangeListener[] = [];

  /**
   * 获取索引值index对应的数据。
   * @param index
   * @returns
   */
  public getData(index: number) {
    return this.dataArray[index]
  }

  /**
   * 获取全部数据
   * @returns
   */
  public getAllData() {
    return this.dataArray
  }

  /**
   *获得数据总数
   * @returns
   */
  public totalCount(): number {
    return this.dataArray.length;
  }

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

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

  // 通知LazyForEach组件需要重载所有子组件
  notifyDataReload(): void {
    this.listeners.forEach(listener => {
      listener.onDataReloaded();
    })
  }

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

  // 更新单个数据
  notifyDataChange(index: number): void {
    this.listeners.forEach(listener => {
      listener.onDataChange(index);
    })
  }

  notifyDataDelete(index: number): void {
    this.listeners.forEach((listener: DataChangeListener) => {
      listener.onDataDelete(index);
    })
  }

  notifyDataMove(from: number, to: number): void {
    this.listeners.forEach((listener: DataChangeListener) => {
      listener.onDataMove(from, to);
    })
  }
}

2: 封装类，完成对数据的具体操作。

import { BasicDataSource } from './BasicDataSource';

export class LazyDataSource<T> extends BasicDataSource<T> {
  /**
   * 在index位置之前插入数据
   */
  public addData(index: number, data: T): void {
    this.dataArray.splice(index, 0, data);
    this.notifyDataAdd(index);
  }

  /**
   * 结尾增加一条数据
   */
  public pushData(data: T): void {
    this.dataArray.push(data);
    this.notifyDataAdd(this.dataArray.length - 1);
  }

  /**
   * 头部添加一条数据
   * @param data
   */
  public unshift(data: T): void {
    this.dataArray.unshift(data);
    this.notifyDataAdd(0);
  }

  /**
   * 结尾追加数组
   * @param dataArray
   */
  public pushArrayData(dataArray: T[]): void {
    this.dataArray.push(...dataArray)
    this.notifyDataReload();
  }

  /**
   * 设置全新数据
   * @param dataArray
   */
  public setData(dataArray: T[]): void {
    this.clear()
    this.pushArrayData(dataArray);
  }

  /**
   * concat 表示将俩个数组合并。
   * @param dataArray
   */
  private appendArrayData(dataArray: T[]): void {
    this.dataArray = this.dataArray.concat(dataArray);
    this.notifyDataReload()
  }


  /**
   * 删除指定位置一条数据
   */
  public deleteData(index: number): void {
    this.dataArray.splice(index, 1);
    // this.notifyDataDelete(index);
    //此处为官方修复删除单个item不及预期的问题，
    //建议在删除后，调用notifyDataReload()重建数据，以达到更新index的目的
    this.reloadData();
  }

  /**
   * 交换数据  先点击一个item ，再点击另一个Item时交换
   * 使用方法参考指南
   * @param from
   * @param to
   */
  public moveData(from: number, to: number): void {
    let temp: T = this.dataArray[from];
    this.dataArray[from] = this.dataArray[to];
    this.dataArray[to] = temp;
    this.notifyDataMove(from, to);
  }

  /**
   * 拖拽排序 在onMove方法中使用
   * 使用方法参考指南
   * @param from
   * @param to
   */
  public moveDataWithoutNotify(from: number, to: number): void {
    let tmp = this.dataArray.splice(from, 1);
    this.dataArray.splice(to, 0, tmp[0]);
    this.reloadData();
  }

  /**
   * 更新指定位置数据
   * @param index
   * @param data
   */
  public updateDataByIndex(index: number, data: T): void {
    this.dataArray.splice(index, 1, data);
    this.notifyDataChange(index);
  }

  /**
   * 通知框架重新刷新数据
   */
  public reloadData(): void {
    this.notifyDataReload();
  }


  /**
   * 根据数据获取索引
   * @param t
   * @returns
   */
  public getIndexByData(t: T): number {
    return this.dataArray.indexOf(t)
  }

  public clear(): void {
    this.dataArray.splice(0, this.dataArray?.length);
  }

  public isEmpty(): boolean {
    return this.dataArray.length === 0;
  }
}

3；使用

//数据集
export class  ProjectData{
  title:string='';
}


@ComponentV2
export struct ProjectContentView {
  //初始化
  @Local projectListData :LazyDataSource<ProjectData>= new LazyDataSource()
  
  aboutToAppear(): void {
  //测试数据，开发环境换成网络请求数据
    this.projectListData.setData(this.mockData())
  }

  build() {
    List({ space: 10 }) {
      LazyForEach(this.projectListData, (item: ProjectData,index:number) => {
        ListItem() {
          this.listItem(item);
        }
        .onClick(() => {
          this.projectListData.deleteData(index)
        })
        .height(150)
        .borderRadius(10)
        .backgroundColor(Color.White)
      }, (item: ProjectData,index:number) => JSON.stringify(item)+index.toString())//此处是个要点。如果发现数据显示不正确，看看这个地方是否写对了。
    }
    .width('100%%')
    .height("100%")
    .layoutWeight(1)
    .scrollBar(BarState.Off)
  }
}