HarmonyOS LazyForEach无法检测数据源的变化进行重新渲染

假设源数据源为:ABABAABB

现在需要过滤单独为A或B进行展示,需要更换数据源

已经更换了数据源,并调用了notifyDataReload方法,但是页面上LazyForEach中数据依旧不更新。

代码处理流程

1.实现IDataSource接口

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

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

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

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

  public addData(index: number, data: T[]): void {
    this.dataArray = this.dataArray.concat(data);
    this.notifyDataAdd(index);
  }

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

  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);
    }
  }

  notifyDataReload(): void {
    this.listeners.forEach((listener: DataChangeListener) => {
      listener.onDataReloaded();
    })
  }

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

  notifyDataChange(index: number): void {
    this.listeners.forEach((listener: DataChangeListener) => {
      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);
    })
  }

  modifyAllData(element: T[]): void{
    this.dataArray = element
    this.notifyDataReload()
  }
}

2.定义数据源数据

@State messages: Array<Message> = []
@State filterMessages: Array<Message> = []
@Watch('onFilterIndexChange')@State filterIndex: number = 0; // 用来监听选择的条件,比如0表示全选,1表示筛选A 2表示筛选B

3.源数据源列表展示

List({ space: 10 }) {
  LazyForEach(this.data, (item: Message) => {
    ListItem() {
      this.MessageItem(item)
    }
  })
}
.scrollBar(BarState.Off)
.cachedCount(4)

@Builder
MessageItem(item: Message) {}  

4.更换数据源

onFilterIndexChange(){
  // AlertDialog.show({message: `${this.filterIndex}`})
  if (this.filterIndex === 0) {
    this.data?.modifyAllData(this.messages)
  }else if(this.filterIndex === 1){
    this.filterMessages = this.messages.filter((message : Message) => message.type === MessageType.HumanoidDetection)
    this.data?.modifyAllData(this.filterMessages)
  }else {
    this.filterMessages = this.messages.filter((message : Message) => message.type === MessageType.MotionDetection)
    this.data?.modifyAllData(this.filterMessages)
  }
}
HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

LazyforEach生成键值的方式与ForEach不同。

LazyforEach生成键值的方式根据文档的内容,可知如果修改了数据源,需要手动修改键值生成方式

分享
微博
QQ
微信
回复
1天前
相关问题
lazyforeach替换数据源解决方案
740浏览 • 1回复 待解决
HarmonyOS picker选择器数据源问题
4浏览 • 0回复 待解决
HarmonyOS lazyforEach渲染问题
48浏览 • 1回复 待解决