HarmonyOS 想让加载图片一致旋转，实现一个等待动画的效果，但是设置代码后不执行动画

参考示例如下：

@Entry
@Component
struct Index {
  @State loading: boolean = false;

  build() {
    Column({ space: 20 }) {
      LoadingView({ loading: this.loading })
      Row({ space: 20 }) {
        Button('开始').onClick(() => {
          this.loading = true;
        })
        Button('结束').onClick(() => {
          this.loading = false;
        })
      }
    }
    .width('100%')
    .height('100%')
  }
}

@Component
export default struct LoadingView {
  @Prop loading: boolean = false
  // 图片旋转角度
  @State angel: number = 0

  build() {
    Image($r("app.media.app_icon"))
      .width(30)
      .height(30)
      .rotate({
        centerX: "50%",
        centerY: "50%",
        angle: this.angel,
      })
      .draggable(false)
      .visibility(this.loading ? Visibility.Visible : Visibility.None)
      .onAppear(() => {
        animateTo({
          curve: Curve.Linear,
          playMode: PlayMode.Normal,
          iterations: -1, // 设置-1表示动画无限循环
          onFinish: () => {
          }
        }, () => {
          this.angel = 360
        })
      })
  }
}