Arkts页面刷新问题

Question

这几天在学习鸿蒙的相关东西,按着视频学习写一些联系的小demo.遇到了一些问题.当我点击刷新按钮的时候,页面上的数据不会刷新.有劳各位同志指教.
(由于代码模版还不支持Ark,只能复制代码了,各位见谅)

@Component
export struct TitleComponent {
  @Link isSwitchData: boolean;

  build() {
    Row() {
      Row() {
        Image($r("app.media.ic_public_back"))
          .height(22)
          .width(22)
          .margin({ right: 10 })
        Text("排行榜").fontSize(20)
      }.width('50%').height('100%')
      .justifyContent(FlexAlign.Start)

      Row() {
        Image($r("app.media.loading"))
          .width(22).height(22).onClick(() => {
          this.isSwitchData = !this.isSwitchData
          console.info("current isSwitchData is " + this.isSwitchData)
        })
      }.width('50%').height('100%')
      .justifyContent(FlexAlign.End)
    }.width('100%').height(47)
    .padding({ left: 26, right: 26 })
    .margin({ top: 10 })
  }
}

@Component
export struct ListHeaderComponent{
  build(){
    Row() {
      Text('排名').fontSize(14).fontColor(Color.Gray).width('30%')
      Text('种类').fontSize(14).fontColor(Color.Gray).width('50%')
      Text('得票数').fontSize(14).fontColor(Color.Gray).width('20%')
    }.width('90%').padding(15)
  }
}

@Component
export struct ListItemComponent {
  index: string;
  name: string;
  vote: string;

  build() {
    Row() {
      if (parseInt(this.index) <= 3) {
        Column() {
          Row() {
            Text(this.index).fontSize(16).fontWeight(FontWeight.Bold).fontColor(Color.White)
          }
          .width(24)
          .height(24)
          .backgroundColor(Color.Blue)
          .borderRadius(18)
          .justifyContent(FlexAlign.Center)
        }.width('30%').alignItems(HorizontalAlign.Start)

      } else {
        Column() {
          Text(this.index).fontSize(16).width(24).fontWeight(FontWeight.Bold)
            .textAlign(TextAlign.Center)
        }.width('30%').alignItems(HorizontalAlign.Start)
      }
      Text(this.name).fontSize(16).fontWeight(FontWeight.Bold).width('50%')
      Text(this.vote).fontSize(16).fontWeight(FontWeight.Bold).width('20%')
    }
  }
}

----index页面
import { Fruit, rankData1, rankData2 } from "../module/DataModele"
import { TitleComponent } from '../view/TitleComponent'
import { ListHeaderComponent } from '../view/ListHeaderComponent'
import { ListItemComponent } from '../view/ListItemComponent'

@Entry
@Component
struct Index {
  rankData1: Array<Fruit> = rankData1
  rankData2: Array<Fruit> = rankData2
  @State isSwitchData: boolean = false

  build() {
    Column() {
      //标题头
      TitleComponent({ isSwitchData: $isSwitchData })
      //排行榜头
      ListHeaderComponent()
      //排行榜列表项
      this.RankList()

    }.width('100%').height('100%').backgroundColor('#f1f3f5')
  }

  @Builder RankList() {
    Column() {
      List() {
        ForEach(this.isSwitchData ? this.rankData1 : this.rankData2, (item: Fruit) => {
          ListItem() {
            ListItemComponent({
              index: item.id,
              name: item.name,
              vote: item.vote
            })
          }.width('100%').height(47)
        })
      }
    }.width('90%').padding(15).backgroundColor(Color.White).borderRadius(18)
  }
}

Answer 1

后来发现将json文件中的harmony改成open harmony就可以正常