HarmonyOS NEXT 应用开发实战

HarmonyOS NEXT 带来了全新的 ArkTS 声明式开发范式。对于熟悉命令式 UI 的开发者来说，状态管理是最容易踩坑的地方。本文通过完整的实战案例，带你彻底搞懂 ArkTS 的状态装饰器体系。

一、声明式 UI 范式

ArkTS 采用声明式 UI，UI 是状态的纯函数：当状态变化时，框架自动重新渲染受影响的组件，开发者无需手动操作 DOM。

1.1 最小可运行示例

@Entry
@Component
struct Index {
  @State message: string = 'Hello HarmonyOS'

  build() {
    Column() {
      Text(this.message)
        .fontSize(30)
        .onClick(() => { this.message = 'Clicked!' })
    }
  }
}

二、状态装饰器体系

ArkTS 提供了多层级的装饰器，用于描述状态的作用范围与传递方向。

• @State — 组件内部私有状态，变化触发本地刷新
• @Prop — 父向子的单向同步
• @Link — 父子双向同步
• @Provide / @Consume — 跨层级依赖注入

2.1 @State 与 @Link 配合

// 父组件
@Component
struct Parent {
  @State count: number = 0
  build() {
    Column() { Child({ count: $count }) }
}

// 子组件
@Component
struct Child {
  @Link count: number
  build() {
    Button(`count=${this.count}`).onClick(() => this.count++)
  }
}

@Link 接收的是状态引用（用 $ 传递），而不是值拷贝，这是双向绑定的关键。

三、跨设备状态共享

借助 @Provide / @Consume，可以在任意后代组件中消费祖先提供的状态，避免一层层透传属性。

总结

掌握状态装饰器的传递方向与刷新边界，是写出高性能 HarmonyOS 应用的前提。建议从 @State + @Link 组合起步，逐步引入 @Provide 处理深层嵌套场景。