HarmonyOS 嵌套层级较多,导致状态管理不能刷新UI

List其中一个ListItem是swiper,swiper中一个item使用了ForEach渲染了2行item。更新最后2行Item中的某一个字段,UI不更新。

let subPickData = this.mergeCellData?.cells[0] as SubPickData  
let moneyPickData = subPickData.cell[0] as MoneyPickData;  
moneyPickData.plateName = '+' + (Math.random() * 100).toFixed(2) + "%";  
moneyPickData.plateChangeRate = '+' + (Math.random() * 100).toFixed(2) + "%";
  • 1.
  • 2.
  • 3.
  • 4.

下面贴出bean的代码:

@Observed  
export class MergeCellData implements CellType {  
  cardData?: CardData;  
  itemType: ItemType;  
  key?: string;  
  cells: ObservedArray<SubPickData | SubEvaluateData> = new ObservedArray();  
  titles: string[] = [];  
}  
@Observed  
export class SubPickData  {  
  subCardData: SubCardData;  
  cell: ObservedArray<MoneyPickData|NewsPickData|BasicPickData|TechnologyPickData> = new ObservedArray();  
  
}  
@Observed  
export class MoneyPickData {  
  plateCode: string;  
  downCount: number;  
  flatCount: number;  
 }  
@Observed  
export class ObservedArray<T> extends Array<T> {  
  constructor(args?: T[]) {  
    if (args instanceof Array) {  
      super(...args);  
    } else {  
      super();  
    }  
  }  
}
  • 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.

下面贴出UI代码:

export struct ChooseStockItem {  
  @ObjectLink @Watch('update') data: MergeCellData;  
  build() {  
    Column() {  
      Swiper(this.controller) {  
        ForEach(this.data?.cells, (subData: SubPickData) => {  
  
          if (subData.subCardData.cardCode == MONEY_PICK) {  
            MoneyPickView({ data: subData.cell })  
              .padding({  
                top: 7,  
                bottom: 16  
              })  
          } else if (subData.subCardData.cardCode == NEWS_PICK) {  
            NewsPickView({ data: subData.cell })  
              .padding({  
                top: 7,  
                bottom: 16  
              })  
          } else if (subData.subCardData.cardCode == BASIC_PICK) {  
            BasicPickView({ data: subData.cell, jumpUrl: subData.subCardData.jumpUrl })  
              .padding({  
                top: 7,  
                bottom: 16  
              })  
          } else if (subData.subCardData.cardCode == TECHNOLOGY_PICK) {  
            TechnologyPickView({ data: subData.cell, jumpUrl: subData.subCardData.jumpUrl })  
              .padding({  
                top: 7,  
                bottom: 16  
              })  
          }  
        }, (subData: SubPickData, index: number) => index.toString() + subData.subCardData.cardCode)  
      }  
      .onAppear(() => {  
        XFLog.e("x", "== MoneyPickViewItem  Swiper ChooseStockItem  onAppear    == ");  
      })  
      .onChange((index: number) => {  
        this.swiperHeight = undefined  
        this.currentIndex = index;  
      })  
      .onAreaChange((_oldValue: Area, newValue: Area) => {  
        this.swiperHeight = newValue.height  
      })  
      .width('100%')  
      .height(this.swiperHeight)  
      .displayCount(1, true)  
      .index($$this.currentIndex)  
      .autoPlay(false)  
      .indicator(false)  
      .cachedCount(4)  
      .loop(false)  
    }  
  }  
}  
@Reusable  
@Component  
export struct MoneyPickView {  
  @ObjectLink @Watch('update') data: ObservedArray<MoneyPickData | NewsPickData | BasicPickData | TechnologyPickData>;  
  build() {  
    Column() {  
      ForEach(this.data, (item: MoneyPickData, index: number) => {  
        MoneyPickViewItem({ data: item, index: index })  
      }, (index: number) => index + '__')  
    }  
  }  
  update(changedPropertyName: string) {  
    XFLog.e("x","MoneyPickViewItem  MoneyPickView  data  == ");  
  }  
}  
@Reusable  
@Component  
struct MoneyPickViewItem {  
  @ObjectLink data: MoneyPickData  
  @Prop index: number  
  build() {  
    Column() {  
      Row() {  
        Text(this.data.fundName)  
          .alignSelf(ItemAlign.Start)  
          .fontSize(14)  
          .fontColor($r('app.color.text_level2'))  
          .onAppear(() => {  
           XFLog.e("x","MoneyPickViewItem  Text  onAppear fundName   == "+this.data.fundName);  
          })  
        if (this.data.fundJumpUrl) {  
          Image($r('app.media.icon_homepage_right_arrow'))  
            .width(16)  
            .height(16)  
            .margin({ left: 2 })  
            .onAppear(() => {  
              XFLog.e("x","MoneyPickViewItem  Image  onAppear fundName   == "+this.data.fundName);  
            })  
            // .syncLoad(true)  
        }  
      }  
    }  
    .alignItems(HorizontalAlign.Start)  
    .margin({ top: getItemSpace(this.index) })  
    .padding({ left: 16, right: 16 })  
  }  
}
  • 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.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 79.
  • 80.
  • 81.
  • 82.
  • 83.
  • 84.
  • 85.
  • 86.
  • 87.
  • 88.
  • 89.
  • 90.
  • 91.
  • 92.
  • 93.
  • 94.
  • 95.
  • 96.
  • 97.
  • 98.
  • 99.
  • 100.
  • 101.
  • 102.
HarmonyOS
2024-10-15 12:03:02
1258浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
FengTianYa

参考一下@Builder装饰器,按引用传递参数时,传递的参数可为状态变量,且状态变量的改变会引起@Builder方法内的UI刷新:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-builder-V5#%E6%8C%89%E5%BC%95%E7%94%A8%E4%BC%A0%E9%80%92%E5%8F%82%E6%95%B0

分享
微博
QQ
微信
回复
2024-10-15 16:02:36


相关问题
状态装饰器 ui刷新的问题
3090浏览 • 1回复 待解决
HarmonyOS 嵌套数组元素的UI刷新方案
1014浏览 • 1回复 待解决
HarmonyOS UI刷新
796浏览 • 1回复 待解决
HarmonyOS List嵌套不能同步数据
961浏览 • 1回复 待解决
HarmonyOS 主线程刷新UI
1115浏览 • 1回复 待解决
HarmonyOS 状态管理问题
729浏览 • 1回复 待解决
HarmonyOS 状态管理咨询
1096浏览 • 1回复 待解决
HarmonyOS 关于状态管理
997浏览 • 1回复 待解决
HarmonyOS scroll嵌套List不能整体滑动
1323浏览 • 1回复 待解决
UI预览不会自动刷新, 且刷新较慢
1925浏览 • 1回复 待解决
HarmonyOS 嵌套Class状态观察问题
654浏览 • 1回复 待解决
HarmonyOS LazyForEach问题刷新UI问题
934浏览 • 1回复 待解决
嵌套ForEach不能自动适应高度
1062浏览 • 1回复 待解决