【HarmonyOS 5.0.0 或以上】构建分页加载组件 PageWrapper：集成刷新 / 空态 / 加载中一体封装

🎯 目标

实际开发中，页面往往需要同时处理以下逻辑：

• 首次加载数据（显示 loading）

• 加载失败（显示错误占位）

• 数据为空（显示空状态）

• 加载成功（渲染内容）

• 支持下拉刷新 / 上拉加载更多

本篇将构建一个 PageWrapper 组件，封装这些通用行为，提升页面开发效率与一致性。

---

🧱 页面状态定义

type PageStatus = 'loading' | 'empty' | 'error' | 'success'

---

🧰 组件实现：PageWrapper.ets

@Component
export struct PageWrapper {
  @Prop status: PageStatus = 'loading'
  @Prop onRetry: () => void = () => {}
  @Prop onRefresh: () => void = () => {}
  @Prop showRefresh: boolean = false

  build() {
    if (this.status === 'loading') {
      Column().height('100%').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center) {
        Text('加载中...').fontSize(14).fontColor('#999')
      }
    } else if (this.status === 'error') {
      EmptyView({
        type: 'error',
        onAction: () => this.onR