ArkUI ARKTS 鸿蒙开发 装饰器
@State 定义一个变量,可用于本页面的双向绑定
官方解释
@State装饰的变量,与声明式范式中的其他被装饰变量一样,是私有的,只能从组件内部访问,在声明时必须指定其类型和本地初始化。初始化也可选择使用命名参数机制从父组件完成初始化。
@State装饰的变量与子组件中的@Prop装饰变量之间建立单向数据同步,与@Link、@ObjectLink装饰变量之间建立双向数据同步。
@State装饰的变量生命周期与其所属自定义组件的生命周期相同。
@Prop
定义一个接收参数的变量,随着父组件变化而变化,子组件更改的值会被父组件覆盖(不会更改父组件的值)
官方解释
@Prop装饰的变量和父组件建立单向的同步关系:
@Prop变量允许在本地修改,但修改后的变化不会同步回父组件。
当数据源更改时,@Prop装饰的变量都会更新,并且会覆盖本地所有更改。因此,数值的同步是父组件到子组件(所属组件),子组件数值的变化不会同步到父组件。
@Link
定义一个变量,不允许定义值,需要通过父组件传入,可以做到父子组件双向绑定
官方解释
@Link装饰的变量与其父组件中的数据源共享相同的值。
用于监听一个数据是否发生变化,如果发生变化,那么触发指定方法,@Watch需要和其他装饰符一起使用
官方解释
@Watch用于监听状态变量的变化,当状态变量变化时,@Watch的回调方法将被调用。@Watch在ArkUI框架内部判断数值有无更新使用的是严格相等(===),
遵循严格相等规范。当在严格相等为false的情况下,就会触发@Watch的回调。
示例代码
@Component export struct TablePage { @State @Watch('updateFixation')//定义回调函数 IsFixationTable:boolean = false; //此处和state一起使用,所以必须写默认值 @State FixationTableType:string = ''; //在值发生发变化后会触发这个回调函数 updateFixation(){ if( this.IsFixationTable){ this.FixationTableType = "固定桌台模式" }else{ this.FixationTableType = "自选桌台模式" } } }
@Require装饰器:校验构造传参
用于标记是否是必传参数
官方解释
当@Require装饰器和@Prop、@State、@Provide、@BuilderParam、
普通变量(无状态装饰器修饰的变量)结合使用时,在构造该自定义组件时,@Prop、@State、@Provide、@BuilderParam和普通变量(无状态装饰器修饰的变量)必须在构造时传参。
限制条件
@Require装饰器仅用于装饰struct内的@Prop、@State、@Provide、@BuilderParam和普通变量(无状态装饰器修饰的变量)
比如 @Prop 不是必传参数,但是标记 @Require 之后这个参数就会必传
//子组件标记 @Require
@Component
export struct ProductItem {
@Require
@Prop Product: ProductDto;
@BuilderParam productTag: () => void;
@Consume("message") TextMsg: string;
build() {
Column() {
}
}
如果不传,调用时报错
@Provide装饰器和@Consume装饰器
简单的来说就是可以改名然后绑定,可以双向同步,但是不能多级双向同步
注意父页面的定义的变量是message 是通过 @Provide("TextMsg") 改名的,如果不需要改名也可以直接写成
父页面写 @Provide message: string = "好神奇啊,竟然改成自动绑定";
子页面写 @Consume message:string;
1.父页面
@Entry @Component struct Category { @Provide("TextMsg") message: string = "好神奇啊,竟然改成自动绑定";
build() { Column() { ProductItem(); } }
}
2.子页面
@Entry @Component struct Category { @Consume("message") TextMsg:string; build() { Column() { Text(this.TextMsg) } } }
@Track装饰器:class对象属性级更新
官方解释
@Track应用于class对象的属性级更新。@Track装饰的属性变化时,只会触发该属性关联的UI更新。
限制条件
-
不能在UI中使用非@Track装饰的属性,包括不能绑定在组件上、不能用于初始化子组件,错误的使用将导致JSCrash;可以在非UI中使用非@Track装饰的属性,如事件回调函数中、生命周期函数中等。
-
建议开发者不要混用包含@Track的class对象和不包含@Track的class对象,如联合类型中、类继承中等。