HarmonyOS 鸿蒙Next中@Observe+@Trace UI不更新问题

可以通过引入三方库 reflect-metadata 和 class-transformer 来实现json对象转指定实例

// Index.ets

let jsonString: Record<string, ESObject> = {
  "data" : [
    {
      "number" :1,
      "age": 20,
      "testA": {
        "str" : "123"
      }
    },
    {
      "number" :2,
      "age": 21,
      "testA": {
        "str" : "456"
      }
    }
  ]
}

import { Type, plainToClass } from 'class-transformer'
import 'reflect-metadata'
import { TestA, Person, ViewA} from './ViewA';

class ResponseObj {
  @Type (() => Person)
  data: Person[] = [];
}

@Entry
@Component
struct Index {
  @State list: Person[] = [];
  @State message: string = 'Click me';

  build() {
    Row() {
      Column() {
        Text(this.message).fontSize(40).onClick(() => {
          let responseObj : ResponseObj = plainToClass(ResponseObj, jsonString);
          console.log (${responseObj.data[0] instanceof Person})
          this.list = this.list.concat(responseObj.data);
        })
        ForEach(this.list, (item : Person, index: number) => {
          ViewA({index:index, test:item.testA})
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

// ViewA.ets

import { Type } from 'class-transformer'

@Observed
export class TestA {
  public str : string

  constructor(str: string) {
    this.str = str;
  }
}

export class Person {
  name: string = ''
  age: number = 1
  @Type(()=>TestA)
  test
  TestA = new TestA('')
}

@Component
export struct ViewA {
  @ObjectLink test
  TestA
  index: number = -1;

  build() {
    Row(){
      Button(View A ${this.testA.str}).onClick(() =>{
        this.index += 1;
        this.testA.str = ${this.index} : Test A String
      })
    }.margin({top : 10 })
  }
}