使用@Observed/@ObjectLink监听多层状态的变化

// 使用@Observed修饰ClassB 
@Observed 
class ClassB { 
  public b: number; 
 
  constructor(b: number) { 
    this.b = b; 
  } 
} 
 
class ClassA { 
  // ClassA成员变量a的类型为ClassB，从而形成嵌套结构，ClassB的成员变量b为第二层变量 
  public a: ClassB 
 
  constructor(a: ClassB) { 
    this.a = a; 
  } 
} 
 
// 构建子组件ViewB用于承载@ObjectLink修饰的变量 
@Component 
struct DChild { 
  // 使用@ObjectLink修饰ClassB的实例class_B 
  @ObjectLink class_B: ClassB; 
 
  build() { 
    Row() { 
      // 将ClassB的成员变量b在UI呈现出来 
      Text(`${this.class_B.b}`) 
    } 
    .margin({ top: 100 }) 
  } 
} 
 
@Entry 
@Component 
struct Index { 
  @State o1: ClassA = new ClassA(new ClassB(0)); 
 
  build() { 
    Column() { 
      DChild({ class_B: this.o1.a }) 
      Row() { 
        // 点击按钮，第二层变量发生变化 
        Button('第二层变量class_B.b加1') 
          .margin({ top: 10, right: 20 }) 
          .backgroundColor('#E8A027') 
          .onClick(() => { 
            // 第二层变量变化，嵌套类ClassB的成员变量b加1 
            this.class_A.a.b += 1; 
          }) 
      } 
      .margin({ top: 50 }) 
    } 
    .width('100%') 
    .justifyContent(FlexAlign.Center) 
  } 
}