harmonyOS学习笔记之状态修饰器@state,@prop,@link

@State:
1.@State装饰的变量拥有其所属组件的状态,可以作为其子组件单向和双向同步的数据源. 当其数值改变时,会引起相关组件的渲染刷新.
2.其声明的变量必须初始化值.
@Prop:
1.@Prop装饰的变量可以和父组件建立单向同步关系.
2.@Prop装饰的变量是可变的,但修改不会同步回父组件。.
3.其声明的变量不允许初始化值.
@Link:
1.@Link装饰的变量和父组件构建双向同步关系的状态变量,父组件会接受来自@Link装饰的变量的修改的同步,父组件的更新也会同步给@Link装饰的变量

@Entry
@Component
struct StateManage {// @State 声明的变量必须初始化值@State name: string = '小明'@State age: number = 11@State msg: string = '我是初始化数据'@State clickContent: string = '点我!点我!!!'build() {Row() {Column() {Text(this.name+'今年'+this.age+'岁').StateManage_textSty(Color.Yellow)Text(this.msg).StateManage_textSty(Color.Pink)Button(this.clickContent).StateManage_btnStyCli(()=>{this.msg = this.age === 18 ? this.name + '成年啦' : this.name + '还没成年呢'this.age = this.age === 18 ? 11 : 18})Divider()StateManagePropItem({content_Prop:this.msg}) //调用的时候必须初始化参数Divider()// 如果是@State <----> @Link 参数传递时,使用$变量名进行传值StateManageLinkItem({content_Link:$msg})}.width('100%')}.height('100%')}
}
@Component
struct StateManagePropItem{//@Prop 装饰的状态数据,方便父子组件之间进行数据传递和同步//其声明的变量不允许初始化值//单向传递 @State --> @Prop@Prop content_Prop: stringbuild(){Column(){Text('Prop:'+this.content_Prop).StateManage_textSty(Color.Red)Button('修改Prop数据').StateManage_btnStyCli(()=>{this.content_Prop = "Prop数据"})}}
}
@Component
struct StateManageLinkItem{@Link content_Link:stringbuild(){Column(){Text('Link:'+this.content_Link).StateManage_textSty()Button('修改Link数据').StateManage_btnStyCli(()=>{this.content_Link = 'Link数据'})}}
}@Extend(Text) function StateManage_textSty(color?:Color){.fontSize(30).fontWeight(FontWeight.Bold).fontColor(color)
}
@Extend(Button) function StateManage_btnStyCli(click:()=>void) {.fontSize(30).onClick(() => {click()})
}