HarmonyOS 鸿蒙Next共享的数据怎样刷新页面？

发布于 1周前 作者 phonegap100 来自 鸿蒙OS

HarmonyOS 鸿蒙Next共享的数据怎样刷新页面？

主组件MainWindow共享了一个类list的实例， 
let playerListData:Array <playerData>= [];
export  {playerListData};

我的自定义组件

import {playerListData} from ‘./MainWindow’; //导入MainWindow的list
@Entry
@CustomDialog
export struct PlayerList {
build() {

…

List({ space: 10 }) {
  ForEach(playerListData, (item: playerData) => {

}

但这个playerListData的数据变化的时候，这个CustomDialog页面并没有发生刷新，请问怎样让这个自定义对话框的页面的随着playerListData的数据更新而刷新页面呢？用@Observed好像也用不了传进来的变量，请帮一下忙！谢谢！

Harmonyos Next教程
3 回复

应该是因为playerListData不是可观测对象，尝试使用[@ObservedV2](/user/ObservedV2)和[@Trace](/user/Trace)装饰器 文档

  1. 将playerListData移动到一个model里面，例如： class PlayerListViewModel
  2. 给PlayerListViewModel类添加[@ObservedV2](/user/ObservedV2)装饰器，并给playerListData字段添加[@Trace](/user/Trace)装饰器
  3. 在MainWindow里面创建PlayerListViewModel类的实例
  4. 在struct PlayerList中导入MainWindow中的PlayerListViewModel实例

也许可以用~

[@ObservedV2](/user/ObservedV2)
export class PlayerListViewModel {
  [@Trace](/user/Trace) playerListData: Array <playerData>= [];
}

export class MainWindows{
model: PlayerListViewModel = new PlayerListViewModel();
}


import {model} from ‘./MainWindow’;


@Entry
@CustomDialog
export struct PlayerList {
build() {
List({ space: 10 }) {
ForEach(model.playerListData, (item: playerData) => {
…
})
}
}

看你这像是数据在页面内进行更新,你想让弹窗里的内容跟着更新? 考虑一下数据更新这些操作放在弹窗自定义struct的生命周期里处理呗

在HarmonyOS鸿蒙Next中，要实现共享数据的页面刷新，关键在于确保数据是可观测的。当共享数据发生变化时，如果这些数据被标记为可观测（通常使用@Observed或@ObservedV2装饰器），那么依赖于这些数据的页面组件就会自动刷新。

具体步骤如下：

  1. 使用@ObservedV2装饰器：将共享数据的类用@ObservedV2装饰器进行装饰，这样该类的实例就会变为可观测对象。
  2. 数据字段添加@Trace装饰器：在类中，为需要共享并触发页面刷新的数据字段添加@Trace装饰器。
  3. 在组件中导入可观测数据：在需要使用共享数据的组件中，导入被@ObservedV2装饰的类的实例。
  4. 确保数据更新：当共享数据发生变化时，由于数据是可观测的，因此依赖于这些数据的页面组件会自动检测到变化并刷新。

如果遵循以上步骤后问题依旧没法解决，请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html。

回到顶部