状态管理V2版本 复杂对象重新赋值后 UI不刷新 HarmonyOS 鸿蒙Next

状态管理V2版本 复杂对象重新赋值后 UI不刷新 HarmonyOS 鸿蒙Next

@ComponentV2
export struct MinePage {

  @Local mineViewModel: MineViewModel = new MineViewModel()

  build() {
    // 昵称
    Text(this.mineViewModel.userInfo?.nickName)
      .fontColor(Color.Black)
      .fontSize(20)
      .fontWeight(FontWeight.Medium)
      .margin({ left: 32 })
  }

  async aboutToAppear(): Promise<void> { 
    //获取个人信息 
    this.mineViewModel.getUserInfo()
  }
}

@ObservedV2
export default class MineViewModel {

  @Trace userInfo: UserInfoEntity = new UserInfoEntity();

  async getUserInfo(): Promise<void> {

    let result = await UserApi.getUserInfo()

    if (result?.data != null) {
      // this.userInfo = JSONUtil.jsonToBean<UserInfoEntity>(UserInfoEntity,
        // JSONUtil.beanToJsonStr(result?.data))

      //不会刷新Ui
      this.userInfo = new UserInfoEntity("123")
      //会刷新ui
      this.userInfo.nickName = "123"
    }
  }
}

@ObservedV2
export class UserInfoEntity {
  @Trace nickName?: string //昵称

  constructor(nickName?: string) {
    this.nickName = nickName;
  }
}

核心代码如上所示，为什么每次给this.userInfo赋值新对象 ，ui不会刷新，但是直接改变属性，ui就会刷新了


更多关于状态管理V2版本 复杂对象重新赋值后 UI不刷新 HarmonyOS 鸿蒙Next的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

重新赋值，把原来的userInfo可观察对象变成不可观察对象，自然导致不会刷新UI了。

@Trace userInfo

更多关于状态管理V2版本 复杂对象重新赋值后 UI不刷新 HarmonyOS 鸿蒙Next的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


那要怎么把接口的返回数据完整赋值给目标呢，好像合并对象的方法也不能用了，难道要自己挨个遍历属性去赋值，

我根据你的代码没有复现你的问题啊，我这边是可以刷新UI的，两种方式都可以呢，

我找到问题了，这样写是没问题的，但是项目里实际运用时，把viewModel写成单例方便HomePage页去调用，导致被提前初始化，没有在@Local的位置初始化，应该是这里导致创建出来的对象不是状态变量了，后面改成从HomePage创建通过@Param传递给MinePage，就既可以刷新又可以外部调用了

private static instance: MineViewModel;

public static getInstance(): MineViewModel {
  if (MineViewModel.instance == null) {
    MineViewModel.instance = new MineViewModel();
  }
  return MineViewModel.instance;
}

在HarmonyOS鸿蒙Next中，状态管理V2版本在处理复杂对象重新赋值时，可能会出现UI不刷新的情况。这通常是由于状态管理系统的依赖追踪机制未能正确识别对象内部属性的变化。状态管理V2版本通过@Observed和@ObjectLink注解来实现数据绑定和UI刷新，但对于复杂对象的深层次属性变化，依赖追踪可能不够精确。

解决此问题的一种方法是显式地触发状态更新。可以通过以下方式实现：

  1. 使用@Observed和@ObjectLink注解：确保复杂对象被@Observed注解标记，并且在UI组件中使用@ObjectLink来绑定对象。这样，当对象的引用发生变化时，UI会自动刷新。

  2. 手动触发更新：如果对象的引用未发生变化，但内部属性发生变化，可以通过手动调用this.setState({})或this.forceUpdate()来强制UI刷新。

  3. 使用不可变数据：在重新赋值复杂对象时，使用不可变数据的方式，确保每次赋值都生成一个新的对象引用。这样，状态管理系统能够正确识别变化并触发UI刷新。

  4. 监听属性变化：对于需要频繁更新的复杂对象，可以通过自定义监听器或事件机制来手动触发UI刷新。

通过这些方法，可以有效解决复杂对象重新赋值后UI不刷新的问题。

回到顶部