在ArkTS中，如何优雅地管理组件状态，并实现跨组件状态共享？

Question

我在开发过程中发现，随着组件数量的增加，状态管理变得越来越复杂。我了解到ArkTS提供了多种状态管理装饰器（如@State、@Prop等），但不知道如何在多个组件间优雅地共享状态。请问有没有什么最佳实践或代码示例，可以展示如何实现跨组件状态共享？

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。
自适应布局、多设备间页面适配和兼容 --来自郝老师直播间

Answer 1

在ArkTS中，你可以使用全局状态管理工具（如Redux、MobX的鸿蒙版本等，如果可用）或鸿蒙提供的状态管理API来优雅地管理组件状态并实现跨组件状态共享。此外，你也可以使用@State装饰器在顶层组件中定义全局状态，并通过@Prop或@Link装饰器将其传递给子组件。

// 顶层组件
@Entry
@Component
struct App {
  @State globalState: { user: string, theme: string } = { user: 'John', theme: 'dark' };

  render() {
    <Child1 globalState={this.globalState} />
    <Child2 globalState={this.globalState} />
  }
}

// 子组件1
@Component
struct Child1 {
  @Prop globalState: { user: string, theme: string };

  render() {
    // 使用globalState...
  }
}

// 子组件2（类似）

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。