HarmonyOSBaseLibs/src/main/ets/view/RefreshView.ets
徐勤民 788e449b25 refactor(app): 优化错误处理和请求频率
- 在多个组件中添加对 'cancel' 错误码的处理,提高用户体验- 在某些场景下增加请求频率限制,减少不必要的网络请求
- 优化部分页面的刷新逻辑,提高性能
2024-11-21 15:22:13 +08:00

85 行
2.7 KiB
Plaintext

import { ToolsHelper } from '../utils/ToolsHelper'
@Component
export struct RefreshView {
@Link isLoading: boolean
@Prop data: Array<ESObject>
@Require keyGenerator?: (item: ESObject, index: number) => string
pageSize: number = 10
onLoadMore?: (pageNum: number) => void
onRefresh?: () => void
private startY: number = 0
private endY: number = 0
private lastNum: number = 0
private _openMore: boolean = false
private _oTime: number = 0
aboutToAppear(): void {
this.onRefresh && this.onRefresh()
}
// 使用父组件@Builder装饰的方法初始化子组件@BuilderParam
@BuilderParam customBuilderParam: (item: ESObject, index: number) => void
build() {
Refresh({ refreshing: $$this.isLoading }) {
if (this.data && this.data.length > 0) {
List() {
ForEach(this.data ?? [], (item: ESObject, index: number) => {
ListItem() {
this.customBuilderParam(item, index)
}
}, (item: ESObject, index: number) => this.keyGenerator!(item, index))
}
.onTouch((event: TouchEvent) => {
const e1 = event.touches[0]
switch (event.type) {
case TouchType.Down:
this._openMore = this.data && this.lastNum >= this.data.length && !this.isLoading
this.startY = e1.y
break
case TouchType.Up:
this.endY = e1.y
if (this.endY - this.startY < -100 && this._openMore) {
const v = this.data && (this.data.length % this.pageSize) === 0
if (v) {
const cTime = new Date().getTime()
// 2024.11.21 测试觉得刷新太多了,暂时改为1秒5间隔
if (cTime - this._oTime > 1500) {
this.onLoadMore && this.onLoadMore(Math.floor(this.data.length / this.pageSize))
this._oTime = cTime
}
} else {
ToolsHelper.showMessage('没有更多数据了')
}
}
break
}
})
.onScrollIndex((first: number, last: number) => {
this.lastNum = last + 1
})
.width('100%')
.height('100%')
.alignListItem(ListItemAlign.Center)
.scrollBar(BarState.Off)
} else {
Text('暂无数据')
.width('100%')
.height('100%')
.textAlign(TextAlign.Center)
}
}
.width('100%')
.layoutWeight(1)
.onStateChange((refreshStatus: RefreshStatus) => {
// ToolsHelper.log('Refresh onStatueChange state is ' + refreshStatus)
})
.onRefreshing(() => {
this.onRefresh && this.onRefresh()
})
}
}