HarmonyOS Next鸿蒙开发:组件级状态管理

197 阅读4分钟

 状态管理入门

为了方便开发者管理组件状态,ArkTS 提供了一系列状态相关的装饰器,例如@State,@Prop,@Link,@Provide和@Consume等等。

image.png

状态管理概述 当开发者希望构建一个动态的、有交互的界面,就需要引入“状态”的概念。’在声明式U编程框架中,UI是程序状态的运行结果,用户构建了一个U模型,其中被装饰器修饰的变量叫做状态变量。当状态变量改变时,U作为返回结果,也将进行对应的改变。 这些状态变量变化所带来的UI的重新渲染在ArkUl中统称为状态管理机制。

image.png

@State状态数据特征 @State状态数据具有以下特征: 支持多种类型:允许class、number、boolean、string强类型的按值和按引用类型。允许这些强类型构成的数组,即Array、Array、Array、Array。不允许object和any。 。支持多实例:组件不同实例的内部状态数据独立, 。内部私有:标记为@State的属性是私有变量,只能在组件内访问, 需要本地初始化:必须为所有@State变量分配初始值,将变量保持未初始化可能导致框架行为O未定义。 。创建自定义组件时支持通过状态变量名设置初始值:在创建组件实例时,可以通过变量名显式指定@State状态属性的初始值。

@Prop @Prop与@State有相同的语义,但初始化方式不同。@Prop装饰的变量必须使用其父组件提供的@State变量进行初始化,允许组件内部修改@Prop变量,但更改不会通知给父组件,即**@Prop属于单向数据绑定。** @Prop状态数据具有以下特征: 。支持简单类型**:仅支持number、string、boolean简单类型:** 私有:仅在组件内访问;4 。支持多个实例:一个组件中可以定义多个标有@Prop的属性 创建自定义组件时将值传递给@Prop变量进行初始化:在创建组件的新实例时,必须初 始化所有@Prop变量,不支持在组件内部进行初始化

@Link ·@Link装饰的变量可以和父组件State变量建立双向数据绑定; 支持多种类型:@Link变量的值与@State变量的类型相同,即class、number、stringaemalboolean或这些类型的数组; 私有:仅在组件内访问, 单个数据源:初始化@Link变量的父组件的变量必须是@State变量;双向通信:子组件对@Link变量的更改将同步修改父组件的@State变量创建自定义组件时需要将变量的引用传递给@Link变量,在创建组件的新实例时,必须使用命名参数初始化所有@Link变量。@Link变量可以使用@State变量或@Link变量的引用进行初始化,@State变量可以通过“$”操作符创建引用

@Consume和@Provide数据管理 @Provide作为数据的提供方,可以更新其子孙节点的数据,并触发页面染。 @Consume在感知到@Provide数据的更新后,会触发当前view的重新渲染。

image.png

@Observed和@ObjectLink数据管理 @Observed应用于类,表示该类中的数据变更被UI页面管理,例如:@Observed classClassA {}。@ObjectLink应用于被@Observed所装饰类的对象,前面的装饰器仅能观察到状态变量第一层变化,而第二层的变化是观察不到的。如需观察到这些状态变量第二层的变化,则需要用到@ObjectLink和@Observed装饰器。 将第二层内容抽取为一个子组件,并将第二层的数据作为子组件的状态变量,该变量需要使用@ObjectLink装饰。

image.png

@Watch @Watch用于监听状态变量的变化,语法结构为: @State @Watch("onChanged")count:number=0 如上给状态变量增加一个@Watch装饰器,通过@Watch注册一个onChanged 当状态变量count被改变时,触发onchanged回调。装饰器@State、@Prop、@Linl、@ObjectLink、@Provide、@Cosume、@StorageProp以及@StorageLink装饰的变量可以监听其变化