HarmonyOS 嵌套数组元素的UI刷新方案

@Entry  
@Component  
struct ArrayPage {  
  @State info: DataBean = new DataBean(1, "qq", [  
    new DataBeanItem(11, 'qq11')  
  ]);  
  @State infos: DataBean[] = [];  
  
  @Builder  
  itemHead(databean: DataBean) {  
    Text(`id:${databean.id} name:${databean.name}`)  
  }  
  
  build() {  
    Row() {  
      Column() {  
        List() {  
          ListItemGroup({ header: this.itemHead(this.info) }) {  
            ForEach(this.info.items, (item: DataBeanItem) => {  
              ListItem() {  
                Text(`childinfo: ${item.childName}`)  
              }  
            })  
          }  
        }  
  
        Button('添加二层数据1').onClick(() => {  
          this.info.items = this.info.items.concat([new DataBeanItem(12, 'qq12')])  
        })  
        Button('添加二层数据2').onClick(() => {  
          this.info.items.push(new DataBeanItem(12, 'qq12'))  
        })  
  
        List() {  
          ForEach(this.infos, (info: DataBean) => {  
            ListItemGroup({ header: this.itemHead(info) }) {  
              RecordItem({ info: info })  
            }  
          })  
        }  
  
        Button('添加一层数据1').onClick(() => {  
          this.infos = [  
            new DataBean(1, 'ww', []),  
            new DataBean(2, 'rr', [new DataBeanItem(21, 'rr21')])  
          ]  
        })  
  
        Button('添加一层数据2').onClick(() => {  
          this.infos.push(new DataBean(3, 'ww', []), new DataBean(4, 'rr', [new DataBeanItem(41, 'rr21')]))  
        })  
      }  
      .width('100%')  
    }  
    .height('100%')  
  }  
}

@Component  
export struct RecordItem {  
  @ObjectLink info: DataBean;  
  
  build() {  
    Column() {  
      ForEach(this.info.items, (item: DataBeanItem) => {  
        ListItem() {  
          Text(`childinfo: ${item.childName}`)  
        }  
      })  
  
      Button('添加二层数据1').onClick(() => {  
        this.info.items = this.info.items.concat([new DataBeanItem(12, 'qq12')])  
      })  
      Button('添加二层数据2').onClick(() => {  
        this.info.items.push(new DataBeanItem(12, 'qq12'))  
      })  
    }  
  }  
}

@Observed  
export class DataBean {  
  id: number = 0;  
  name: string = '';  
  items: DataBeanItem[] = [];  
  
  constructor(id: number, name: string, items: DataBeanItem[]) {  
    this.id = id;  
    this.name = name;  
    this.items = items;  
  }  
}  
  
@Observed  
export class ArrayDataBeanItem extends Array<DataBeanItem>{  
  
}  
  
@Observed  
export class DataBeanItem {  
  childId: number = 0;  
  childName: string = '';  
  
  constructor(childId: number, childName: string) {  
    this.childId = childId;  
    this.childName = childName;  
  }  
}