鸿蒙 使用 Refresh 实现下拉刷新_鸿蒙 refresh 手动刷新

import promptAction from '@ohos.promptAction'
 
@Entry
@Component
struct Index {
 
  @State
  refreshing: boolean = false
 
  @State
  list: number[] = Array(20).fill(Date.now())
 
  @Builder
  content(){
    Stack(){
      Row(){
        LoadingProgress()
          .height(32)
        Text('正在刷新...')
          .fontSize(16)
          .margin({left:20})
      }
      .alignItems(VerticalAlign.Center)
    }
    .align(Alignment.Center)
  }
 
  build() {
    Column(){
      Refresh({ refreshing: $$this.refreshing, builder: this.content() }){
        List(){
          ForEach(this.list, (item: string)=>{
            ListItem(){
              Row(){
                Text(item.toString())
              }
              .justifyContent(FlexAlign.Center)
              .width('100%')
              .padding(20)
            }
          })
        }
        .divider({
          strokeWidth: 1,
          color: Color.Yellow,
          startMargin: 10,
          endMargin: 10
        })
      }
      .onRefreshing(()=>{
        setTimeout(()=>{
          this.list = Array(20).fill(Date.now())
          this.refreshing = false
          promptAction.showToast({message:'刷新成功'})
        },1000)
      })
    }
    .height('100%')
    .width('100%')
 
  }
}