HarmonyOS 关于LazyForEach懒加载实现列表页面后，搜索功能何如做？

可以用LazyForEach实现首次加载，想做搜索功能，搜索后还在当前页面显示，搜索后数据更新，页面数据应该怎样操作。

HarmonyOS

put_get

2024-10-29 10:40:52

浏览

回答 1

待解决

回答 1

按赞同

按时间

zbw_apple

LazyForEach数据的修改一般都在类里定义方法进行处理。鉴于的场景其实可以考虑直接用普通的ForEach循环

1、内层数据的类新增searchKeyData方法进行搜索关键词过滤操作。

// 内层数据  
class MyDataSource1 extends BasicDataSource {  
  private dataArray: string[] = [];  
  
  public totalCount(): number {  
    console.log('总长', this.dataArray.length)  
    return this.dataArray.length;  
  }  
  
  public getData(index: number): string {  
    return this.dataArray[index];  
  }  
  
  public addData(index: number, data: string): void {  
    this.dataArray.splice(index, 0, data);  
    this.notifyDataAdd(index);  
  }  
  
  public pushData(data: string): void {  
    this.dataArray.push(data);  
    this.notifyDataAdd(this.dataArray.length - 1);  
  }  
  
  public deleteData(index: number): void {  
    this.dataArray.splice(index, 1);  
    this.notifyDataDelete(index);  
  }  
  
  public searchKeyData(keyword: string): void {  
    let i = 0;  
    while (i < this.totalCount()) {  
      if (!this.dataArray[i].includes(keyword)) {  
        // 不匹配  
        this.deleteData(i);  
      } else {  
        // 内容匹配  
        i++;  
      }  
    }  
    console.log('12222', this.totalCount())  
  }  
}

2、利用DataSource类里新增的方法进行数据修改。

Row(){  
  Text('查询内容：')  
  Text(this.keyWord)  
  Button('搜索')  
    .onClick(()=>{  
      console.log('333', this.list)  
      const total = this.list.totalCount();  
      for (let i = 0; i < total; i++) {  
        const listItemData = this.list.getData(i);  
        // 关键代码在MyDataSource1类中新增searchKeyData方法去进行过滤操作  
        listItemData.orderList.searchKeyData(this.keyWord);  
      }  
    })  
}

lazyforeach使用可以参考文档：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-rendering-control-lazyforeach-V5#非首次渲染