【每日学点 HarmonyOS Next 知识】点赞动画实现、Grid 当前显示条目、刷新组件、代码规范、状态变量

customRefreshComponent() {  Stack() {    Row() {      LoadingProgress().height(32)      Text("正在刷新...").fontSize(16).margin({ left: 20 })    }    .alignItems(VerticalAlign.Center)  }.width("100%").align(Alignment.Center)  //.clip(true)  .constraintSize({minHeight:32})}//设置.clip(true)或者.constraintSize({minHeight:32})可解决，minHeight的值可自行设置，参照LoadingProgress的高度

@ObservedV2class ViewModel {  @Trace title: string = "开始"  @Trace title2: string = "t1"  @Trace observeList: DemoItemObserved[] = []
  loadData() {    setTimeout(() => {      this.title = "成功";      this.title2 = "t2";      for (let index = 0; index < 4; index++) {        this.observeList.push(new DemoItemObserved(`张${index}`, "中文学校"))      }    }, 2000)  }}
@ObservedV2class DemoItemObserved {  @Trace title: string = "张大"  @Trace subTitle: string = "外国语学校"
  constructor(title: string, subTitle: string) {    this.title = title;    this.subTitle = subTitle;  }}
@Componentstruct View1 {  @Prop title: string  build() {    Text(this.title)  }}
@Componentstruct View2 {  viewModel: ViewModel = new ViewModel()
  build() {    List() {      ForEach(this.viewModel.observeList, (item: DemoItemObserved) => {        ListItem() {          Row() {            Text(item.title)            Text(item.subTitle)          }        }      })    }  }}
@Entry@Componentstruct Index {  viewModel: ViewModel = new ViewModel()
  build() {    Column() {      Button("模拟加载数据")        .onClick(() => {          this.viewModel.loadData()        })      Text(this.viewModel.title)      View1({ title: this.viewModel.title2 })      View2({ viewModel: this.viewModel })    }  }}