HarmonyOS鸿蒙Next中a->b->c三个页面依次跳转，c页面保存数据后依次返回到a页面需要刷新数据

HarmonyOS鸿蒙Next中a->b->c三个页面依次跳转，c页面保存数据后依次返回到a页面需要刷新数据 大佬们，这种情况，需要怎么实现比较好啊

5 回复

可以用通知，有个emitter的api，你可以参考下。

更多关于HarmonyOS鸿蒙Next中a->b->c三个页面依次跳转，c页面保存数据后依次返回到a页面需要刷新数据的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


背景知识：

1、使用全局静态变量进行处理

2、使用EventHub 事件总线进来消息回调刷新

3、使用 preferences 数据持久化监听

问题解决:

1、全局变量刷新

//1、定义一个全局变量
// common/GlobalData.ets
export class GlobalData {
  // 全局变量刷新标记
  static needRefreshA: boolean = false;
}

//2、 A页面监听显示时触发（每次从后台返回/跳转回来都会执行）
  onPageShow() {
    // 检查是否需要刷新
    if (GlobalData.needRefreshA) {
      this.refreshData(); // 刷新数据
      GlobalData.needRefreshA = false; // 重置标记
    }
  }

  //3、C页面修改参数
   GlobalData.needRefreshA = true;

2、EventHub 事件总线

const context = this.getUIContext().getHostContext() as common.UIAbilityContext;

// 1、在A页面定义事件回到方法：
 onPageShow() {
    // 订阅事件
    this.context.eventHub.on("refreshAPage", () => {
      this.refreshData(); // 执行刷新
    });
  }
//注销事件
onPageHide() {
    // 取消订阅，避免内存泄漏
    this.context.eventHub.off("refreshAPage");
  }


  //2.C页面发送事件
  this.context.eventHub.emit("refreshAPage");

3、数据持久化监听

// A页面onPageShow中读取
async onPageShow() {
  let value = PreferencesUtils.getString("refreshA")

}
//C页面写入参数
PreferencesUtils.put("refreshA","true")

// PreferencesUtils 工具类 记得在 EntryAbility.ets -> onCreate()  PreferencesUtils.init(this.context) 初始化
import { preferences, ValueType } from "@kit.ArkData";


export class  PreferencesUtils{

    private static dataPreferences:preferences.Preferences | null = null;

    static init(context: Context){
        let options: preferences.Options = { name: 'myPreferences' };
        PreferencesUtils.dataPreferences = preferences.getPreferencesSync(context, options);
    }

    static has(key:string):boolean{
        if(PreferencesUtils.dataPreferences==null){
            return false
        }
        return PreferencesUtils.dataPreferences?.hasSync(key) ?? false
    }

    static put(key:string,data:ValueType){
        if(PreferencesUtils.dataPreferences==null){
            return
        }
        PreferencesUtils.dataPreferences.putSync(key,data)
        PreferencesUtils.dataPreferences.flushSync()
    }

    static getString(key:string):string{
        if(PreferencesUtils.dataPreferences==null){
            return ""
        }
        return PreferencesUtils.dataPreferences?.getSync(key,"") as string
    }

    static getNumber(key:string):number{
        if(PreferencesUtils.dataPreferences==null){
            return 0
        }
        return PreferencesUtils.dataPreferences?.getSync(key,0) as number
    }
}

a页面每次onPageShow都重新读取数据即可。

在HarmonyOS Next中，可通过EventHub或UIAbilityContext的通信机制实现页面间数据刷新。在C页面保存数据后，触发自定义事件或调用startAbilityForResult返回数据至A页面。A页面监听事件或接收返回结果，在onPageShow或回调方法中更新数据。页面栈管理由系统自动处理，依次返回无需手动干预。

在HarmonyOS Next中实现这种跨页面数据刷新，推荐使用 EventHub 或 UIState 进行事件/状态通信，这是最简洁高效的方式。

核心思路：C页面保存数据后，发布一个事件或更新一个全局可观察的状态，A页面订阅该事件或状态，在回调中执行数据刷新。

1. 使用EventHub（事件总线）方案： 这是最直接的解耦方式。

  • 在C页面保存成功后，发布一个自定义事件（例如：'data_saved'）。
    // C页面
import { eventHub } from '[@ohos](/user/ohos)/base'; // 假设的EventHub单例
// ... 保存数据逻辑
onSaveSuccess() {
  // 保存数据...
  eventHub.emit('data_saved', { /* 可携带数据 */ });
  router.back();
}
  • 在A页面（通常在aboutToAppear生命周期中）订阅该事件。
    // A页面
import { eventHub } from '[@ohos](/user/ohos)/base';
aboutToAppear() {
  this.eventToken = eventHub.on('data_saved', () => {
    this.refreshData(); // 执行刷新数据的方法
  });
}
aboutToDisappear() {
  eventHub.off('data_saved', this.eventToken); // 页面消失时取消订阅，避免内存泄漏
}

2. 使用UIState（应用状态管理）方案： 如果数据状态较复杂，更适合使用状态管理。

  • 定义一个全局的UIState（例如使用[@ohos](/user/ohos)/arkui中的状态管理机制）。
    // 定义全局状态类
export class AppState {
  [@State](/user/State) @Watch('onDataChange') needRefresh: boolean = false;
  onDataChange() {
    // 状态变化回调
  }
}
  • 在C页面保存后，更新这个全局状态。
    // C页面
appState.needRefresh = true;
router.back();
  • 在A页面，监听这个全局状态。
    // A页面
[@State](/user/State) appState: AppState = getAppState();
// 在UI或生命周期中响应appState.needRefresh的变化，调用refreshData

3. 使用页面路由参数回传（适用于简单场景）： 如果数据量小，可以在router.back()时通过params传递标识。

  • C页面返回时：
    router.back({
  url: 'pages/PageB',
  params: { refreshFlag: true }
});
    然后在B页面同样方式传递回A页面。这种方式在中间页面较多时较繁琐，维护性不如事件或状态管理。

总结建议：

  • 优先使用EventHub：实现简单，页面间完全解耦，是处理此类“刷新”通知的典型模式。
  • 如果应用已使用或需要更集中的状态管理，则采用UIState方案。
  • 避免使用直接依赖页面路径的强耦合方式。

确保在A页面的aboutToAppear中也有数据刷新逻辑，以处理直接重新进入A页面的情况。

回到顶部