HarmonyOS(61) 组件间状态共享的分类以及状态选择器的选取优先级

状态共享

状态共享的分类

HarmonyOS的组件之间是可以共享状态数据了,不同的组件之间,状态共享的场景也不一样,根据共享范围从小到大可以有三种场景:

  1. 父子组件之间的共享状态(家庭内部矛盾)。
  2. 同一组件树不同子组件间的共享状态(家族内部矛盾)。
  3. 不同组件树间的共享状态(不同家族间的矛盾)。
  • 父子组件之间的共享状态(家庭内部矛盾):可以用下图表示:"父组件"和其子组件"子组件A"、"子组件B"共享loading状态
  • 同一组件树不同子组件间的共享状态(家族内部矛盾):如下图,祖先组件的左子树上"孙子组件AAA"和右子树上"孙子组件BAA"共享loading状态。
  • 不同组件树间的共享状态(不同家族间的矛盾):如下图,组件树A内"子组件AA"和组件树B内"孙子组件AAA"共享loading状态。

状态共享选择器

对于上述三种场景,ArkUI提供了@State+@Prop、@State+@Link、@State+@Observed+@ObjectLink、@Provide+@Consume、AppStorage、LocalStorage六种装饰器组合以解决不同范围内的组件间状态共享。按照共享范围能力从小到大,各装饰器组合的共享范围能力如下:

  • @State+@Prop、@State+@Link、@State+@Observed+@ObjectLink:三者的共享范围为从@State所在的组件开始,到@Prop/@Link/@ObjectLink所在组件的整条路径,路径上所有的中间组件通过@Prop/@Link/@ObjectLink都可以共享同一个状态。
  • @Provide+@Consume:状态共享范围是以@Provide所在组件为祖先节点的整棵子树,子树上的任意后代组件通过@Consume都可以共享同一个状态。
  • LocalStorage:共享范围为UIAbility内以页面为单位的不同组件树间的共享,适合对于单个Ability而言"全局"的变量,主要用于不同页面间的状态共享场景。
  • AppStorage:共享范围是应用全局。适合对于整个应用而言"全局"的变量或应用的主线程内多个UIAbility实例间的状态共享,如用户信息。

@State与@prop@Link@Observed+@ObjectLink组合的区别

对于具有相同优先级的装饰器选择方案@State+@Prop、@State+@Link和@State+@Observed+@ObjectLink。在选择方案时,需要结合具体的业务场景和状态数据结构的复杂度。这三种不同的装饰器组合方案在内存消耗、性能消耗和对数据类型的支持能力都不相同,如下:

  • @State+@Prop:适合状态结构简单,且共享状态的组件间层级相差不大的场景。或功能上要求子组件不实时同步修改给父组件的场景。
  • @State+@Link:适合状态结构复杂,且共享状态的组件间层级相差不大的场景。或功能上要求子组件对状态的修改实时同步给父组件的场景。
  • @State+@Observed+@ObjectLink:适合需要观察嵌套类对象的子属性变化的场景或对象数组的数据项属性变化的场景,如监听列表卡片上某个属性的变化。

合理选择装饰器的顺序

在实际开发中,合理选择装饰器主要包含以下三步:

  • 首先根据状态需要共享的范围大小,尽量选择共享能力小的装饰器方案,优先级依次为@State+@Prop、@State+@Link或@State+@Observed+@ObjectLink > @Provide+@Consume > LocalStorage > AppStorage

  • 当共享的状态的组件间层级相差较大时,为避免较差的代码可扩展性和可维护性,@Provide+@Consume的方案要优于层层传递的共享方案,因为@Provide+@Consume适合用于对于整个组件树而言"全局"的状态,且该状态改动不频繁的状态共享场景,如共享界面的路由信息。

  • 对于具有相同优先级的@State+@Prop、@State+@Link或@State+@Observed+@ObjectLink 三个方案,应结合状态的复杂程度和装饰器各自的特性选择。

参考资料

HarmonyOS鸿蒙学习笔记(6) @Consume和@Provide作用说明和简单案例
HarmonyOS鸿蒙学习笔记(5)@State作用说明和简单案例
HarmonyOS鸿蒙学习笔记(12)@Link的作用
HarmonyOS鸿蒙学习笔记(14)@ObjectLink的作用
HarmonyOS(31) @Prop标签使用指南
HarmonyOS(32) @Link标签使用指南
性能优化之最小化状态共享范围

相关推荐
弓.长.3 小时前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-netinfo — 网络状态检测
网络·react native·harmonyos
弓.长.3 小时前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-network-info — 网络信息获取
网络·react native·harmonyos
弓.长.4 小时前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-image-crop-picker — 图片选择裁剪组件
react native·react.js·harmonyos
讯方洋哥15 小时前
HarmonyOS App开发——鸿蒙ArkTS基于首选项引导页的集成和应用
华为·harmonyos
左手厨刀右手茼蒿21 小时前
Flutter 三方库 all_lint_rules_community 的鸿蒙化适配指南 - 在鸿蒙系统上构建极致、严谨、基于全量社区 Lint 规则的工业级静态代码质量与安全审计引擎
flutter·harmonyos·鸿蒙·openharmony·all_lint_rules_community
雷帝木木21 小时前
Flutter for OpenHarmony:Flutter 三方库 cbor 构建 IoT 设备的极致压缩防窃协议(基于标准二进制 JSON 表达格式)
网络·物联网·flutter·http·json·harmonyos·鸿蒙
王码码203521 小时前
Flutter 三方库 servicestack 的鸿蒙化适配指南 - 实现企业级 Message-based 架构集成、支持强类型 JSON 序列化与跨端服务调用同步
flutter·harmonyos·鸿蒙·openharmony·message-based
里欧跑得慢21 小时前
Flutter 三方库 jsonata_dart 的鸿蒙化适配指南 - 实现高性能的 JSON 数据查询与转换、支持 JSONata 表达式引擎与端侧复杂数据清洗
flutter·harmonyos·鸿蒙·openharmony·jsonata_dart
chenyingjian1 天前
鸿蒙|性能优化-内存及其他优化
harmonyos
总有刁民想爱朕ha1 天前
haihong Os 鸿蒙开源版开发一个pc版软件应用(1)
华为·开源·harmonyos