HarmonyOS 鸿蒙Next SDK UI组件是否支持增加缺省略页？如何在NavDestination或Navigation中增加数据未加载或加载失败的缺省页？是否可共通使用避免每页都加？

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

HarmonyOS 鸿蒙Next SDK UI组件是否支持增加缺省略页？如何在NavDestination或Navigation中增加数据未加载或加载失败的缺省页？是否可共通使用避免每页都加？ 请问是否支持给SDK 的UI组件增加缺省略页？

当前需求是希望在NavDestination或Navigation 中增加一个数据未加载或数据加载失败的缺省页。

请问是否有什么方式可以做到共通使用，不想在每一个页面都加。

Harmonyos Next教程
2 回复

您可以参考一下Navigation 生命周期的onWillShow和onShown方法，当前页面显示时会触发这些方法，您可以在这些方法里调整是否需要加载数据

可以使用navDestinationSwitch监听Navigation的页面切换事件，然后配合router实现跳转到缺省略页: https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-arkui-observer-V5#observeronnavdestinationswitch12

例如在连接案例里callBackFunc添加一个router跳转:

function callBackFunc(info: observer.NavDestinationSwitchInfo) {
  console.info(`testTag navDestinationSwitch from: ${JSON.stringify(info.from)} to: ${JSON.stringify(info.to)}`)
  
  //添加您跳转到缺省页的条件
  router.pushUrl({
    url:'pages/xx缺省略页'
  })
}

更多关于HarmonyOS 鸿蒙Next SDK UI组件是否支持增加缺省略页？如何在NavDestination或Navigation中增加数据未加载或加载失败的缺省页？是否可共通使用避免每页都加？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


HarmonyOS 鸿蒙Next SDK UI组件支持增加缺省页（或称占位页），用于处理数据未加载或加载失败的情况。在NavDestination或Navigation组件中，可以通过以下方式实现缺省页的添加：

  1. 全局缺省页配置：在Navigation图的根节点或关键节点配置一个全局的缺省页Fragment或Page。这个缺省页可以在数据加载失败或未加载时显示，而无需在每个页面单独配置。

  2. 动态切换：在数据加载逻辑中，根据加载状态（成功、失败、未开始）动态切换显示的页面。若数据加载失败或未加载，则导航至缺省页。

  3. 监听器设置：为Navigation组件设置监听器，监听导航事件和数据加载状态。当检测到数据加载失败或未加载时，通过编程方式导航至缺省页。

  4. 复用缺省页组件：创建一个通用的缺省页组件，并在需要时复用。这可以通过自定义组件或页面模板实现，减少重复代码。

通过上述方法，可以在鸿蒙的NavDestination或Navigation中实现缺省页的共通使用，避免每页都单独添加。如果问题依旧没法解决请联系官网客服，官网地址是 https://www.itying.com/category-93-b0.html

回到顶部