Observed和ObjectLink数据管理

Less than 1 minute

Observed和ObjectLink数据管理

@observed是用来class的修饰器,表示此对象中的数据变更将被UI页面管理。@objectLink用来修饰被@observed装饰的变量。

// 需要监控的对象
@Observed class ClassA {
    static nextID : number = 0;
    public id : number;
    public c: number;

    constructor(c: number) {
        this.id = ClassA.nextID++;
        this.c = c;
    }
}

@Observed class ClassB {
    public a: ClassA;

    constructor(a: ClassA) {
        this.a = a;
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
@Component
struct ViewA {
  @ObjectLink a : ClassA;
  label : string = "ViewA1";
  build() {
     Row() {
        Button(`ViewA [${this.label}] this.a.c=${this.a.c} +1`)
        .onClick(() => {
            this.a.c += 1;
        })
        Button(`ViewA [${this.label}] reset this.a =new ClassA(0)`)
        .onClick(() => {
            this.a = new ClassA(0); // ERROR, this.a is immutable
        })
     }
  }
}

@Entry
@Component 
struct ViewB {
  @State b : ClassB = new ClassB(new ClassA(0));

  build() {
     Column() {
       ViewA({label: "ViewA #1", a: this.b.a})
       ViewA({label: "ViewA #2", a: this.b.a})

       Button(`ViewB: this.b.a = new ClassA(0)`)
        .onClick(() => {
            this.b.a = new ClassA(0);
        })  
        Button(`ViewB: this.b = new ClassB(ClassA(0))`)
        .onClick(() => {
            this.b = new ClassB(new ClassA(0));
        }) 
    }
  } 
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

说明: @ObjectLink用于修饰变量,并且不可以初始化。@Observed用于修饰类。