纯血鸿蒙APP实战开发——侧滑返回事件拦截案例

介绍

在编辑场景中，存在用户误触返回，导致内容未保存就退出编辑页的现象;

本示例介绍使用NavDestination组件的onBackPressed回调对返回事件进行拦截，提示用户保存编辑内容，并使用preferences实例持久化保存内容。

效果预览图

使用说明

1. 编辑状态侧滑返回弹出弹窗提醒用户是否保存。
2. 点击弹窗空白区域，弹窗消失，继续编辑。
3. 点击保存按钮，返回主页，保存用户编辑的数据，再次进入编辑页可在上次编辑的基础上再次编辑。

实现思路

1. 因为功能是以har的形式集成在主工程中，没有@Entry修饰的组件，也无法作为入口组件，不能使用@Entry组件的onBackPress生命周期函数。

2. 在使用方面onBackPressed是NavDestination自己的事件，需配合NavDestination组件使用；
   且组件本身用于显示Navigation内容区，作为子页面的根容器，因此若拦截子页面的返回事件，可使用onBackPressed回调。

3. onBackPress生命周期函数只能在@Entry组件中使用，因此若对入口组件的返回事件拦截可使用onBackPress生命周期函数。

4. 通过NavDestination组件的onBackPressed回调对返回事件进行拦截；

  // 应用主页用NavDestination承载，用于显示Navigation的内容区
      Navigation(this.pageStackForComponentSharedPages) {
   
      }
      .onAppear(() => {
   
        this.pageStackForComponentSharedPages.pushPathByName("MainPage", null, false