鸿蒙Next组件状态管理装饰器V1

@Entry
@Component
struct User{
  @State userName:string='张三'
  @State tall:string='170'
  @Provide age:string='18'
  @State person:Person = new Person('李四',20)
  build() {
    Column({space:20}){
      Stack(){
        Text('父组件 State 修饰：'+this.userName).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Blue)
      .onClick(()=>{
         //是为了每次点击能发生数据变化
        this.userName='点击了父组件 uaerName'+Math.floor(Math.random() * 11)
      })
      Stack(){
        Text('父组件 State 修饰：'+this.tall).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Green)
      .onClick(()=>{
        this.tall='点击了父组件 tall'
      })
      Stack(){
        Text('父组件 Provide 修饰：'+this.age.toString()).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Brown)
      .onClick(()=>{
        this.age='点击了父组件 age'
      })
      Stack(){
        Text('父组件 State 修饰：'+this.person.name).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Grey)
      .onClick(()=>{
        this.person.name='李思思'
      })
      Text('------下面是引用的子组件---------')

      child({userName:this.userName,tall:this.tall,person:this.person})
    }
  }
}
@Component
struct child{
  @Prop userName:string
  @Link tall:string
  @Consume age:string
  @ObjectLink person:Person
  build() {
    Column({space:20}){
      Stack(){
        Text('子组件 Prop 修饰：'+this.userName).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Blue)
      .onClick(()=>{
        this.userName='点击了子组件'
      })
      Stack(){
        Text('子组件 Link 修饰：'+this.tall).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Green)
      .onClick(()=>{
        this.tall='点击了子组件'
      })
      Stack(){
        Text('子组件 Consume 修饰：'+this.age.toString()).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Brown)
      .onClick(()=>{
        this.age='点击了子组件'
      })
      Stack(){
        Text('子组件 ObjectLink 修饰：'+this.person.name).fontSize(20).fontColor(Color.White)
      }.alignContent(Alignment.Center)
      .width('100%')
      .height(60)
      .backgroundColor(Color.Grey)
      .onClick(()=>{
        this.person.name='李四'
      })
    }
  }
}

@Observed
class Person{
   name:string=''
   age:number=0
  constructor(name:string,age:number) {
     this.name=name;
     this.age=age;
  }
}