封装lazyforeach懒加载方法



export class Evaluate {
userId:string
userIcon: Resource
userNumber: string
rating:number
desc: string
}



import { BasicDataSource } from './BasicDataSource';

export class MyDataSource<T> extends BasicDataSource<T> {

private dataArray: T[] = [];

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

public getData(index: number): T {
return this.dataArray[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)
}

public pushAllData(data: T[]): void {
for (let i = 0; i <= this.dataArray.length; i++) {
this.pushData(data[i]);
}
}

}
----------
export class BasicDataSource<T> implements IDataSource {
private listeners: DataChangeListener[] = [];
private originDataArray: T[] = [];

public totalCount(): number {
return 0;
}

public getData(index: number): T {
return this.originDataArray[index];
}

// 该方法为框架侧调用,为LazyForEach组件向其数据源处添加listener监听
registerDataChangeListener(listener: DataChangeListener): void {
if (this.listeners.indexOf(listener) < 0) {
console.info('add listener');
this.listeners.push(listener);
}
}

// 该方法为框架侧调用,为对应的LazyForEach组件在数据源处去除listener监听
unregisterDataChangeListener(listener: DataChangeListener): void {
const pos = this.listeners.indexOf(listener);
if (pos >= 0) {
console.info('remove listener');
this.listeners.splice(pos, 1);
}
}

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

// 通知LazyForEach组件需要在index对应索引处添加子组件
notifyDataAdd(index: number): void {
this.listeners.forEach(listener => {
listener.onDataAdd(index);
})
}

// 通知LazyForEach组件在index对应索引处数据有变化,需要重建该子组件
notifyDataChange(index: number): void {
this.listeners.forEach(listener => {
listener.onDataChange(index);
})
}

// 通知LazyForEach组件需要在index对应索引处删除该子组件
notifyDataDelete(index: number): void {
this.listeners.forEach(listener => {
listener.onDataDelete(index);
})
}

// 通知LazyForEach组件将from索引和to索引处的子组件进行交换
notifyDataMove(from: number, to: number): void {
this.listeners.forEach(listener => {
listener.onDataMove(from, to);
})
}
}

-----------------

import { MyDataSource } from '../utils/MyDataSource';
import { Evaluate } from '../viewModel/DetailsModel';


@Entry
@Component
struct MyComponent {
private data:MyDataSource<Evaluate> = new MyDataSource();

aboutToAppear() {

const evaluate:Evaluate[] = [
{
userId:'1',
userIcon: $r('app.media.icon'),
userNumber:'18522679763',
rating:5,
desc:'和描述相符。质量挺好,很喜欢呀'
},
{
userId:'2',
userIcon: $r('app.media.icon'),
userNumber:'18522679796',
rating:5,
desc:'和描述相符。质量挺好,很喜欢呀,真心推荐'
}
]

for (let i = 0; i <= 100; i++) {
this.data.pushData({
userId:( i + 1) + '' ,
userIcon: $r('app.media.icon'),
userNumber:'18522679796',
rating:5,
desc:'和描述相符。质量挺好,很喜欢呀,真心推荐'
})
}

}

build() {
List({ space: 3 }) {
LazyForEach(this.data, (item: Evaluate) => {
ListItem() {
Row() {
Text(item.userId).fontSize(50)
.onAppear(() => {
console.info("appear:" + item)
})
}.margin({ left: 10, right: 10 })
}
}, (item: Evaluate) => item.userId)
}.cachedCount(5)
}
}



posted @ 2025-04-02 11:16  13522679763-任国强  阅读(23)  评论(0)    收藏  举报