HarmonyOS 鸿蒙Next Navigation组件Active状态和状态刷新问题

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

HarmonyOS 鸿蒙Next Navigation组件Active状态和状态刷新问题

我在使用Navigation组件时，使用toolbarConfiguration的方式实现，然后通过点击事件刷新当前的组件是不是active状态，但是我这边通过debug，点击第一次的时候currentIndex的值改变了，但是点击第二次的时候界面才进行刷到新的状态，这是怎么回事呀

代码：

Navigation() {


}
.mode(NavigationMode.Auto)
.toolbarConfiguration([
  {
    value:<span class="hljs-string">"首页"</span>,
    icon: <span class="hljs-string">'resources/base/media/ic_tab_home.png'</span>,
    activeIcon:<span class="hljs-string">'resources/base/media/ic_tab_home_selected.png'</span>,
    action:()=&gt;{
      <span class="hljs-keyword">this</span>.currentTab = <span class="hljs-number">0</span>;
      hilog.error(<span class="hljs-number">0x01</span>,<span class="hljs-string">"yst"</span>,<span class="hljs-string">"0"</span>);
    },
    status:<span class="hljs-keyword">this</span>.currentTab == <span class="hljs-number">0</span>?ToolbarItemStatus.ACTIVE:ToolbarItemStatus.NORMAL
  },
  {
    value:<span class="hljs-string">"题库"</span>,
    icon: <span class="hljs-string">'resources/base/media/ic_tab_bank.png'</span>,
    activeIcon:<span class="hljs-string">'resources/base/media/ic_tab_bank_selected.png'</span>,
    action:()=&gt;{
      <span class="hljs-keyword">this</span>.currentTab = <span class="hljs-number">1</span>;
      hilog.error(<span class="hljs-number">0x01</span>,<span class="hljs-string">"yst"</span>,<span class="hljs-string">"1"</span>);
    },
    status:<span class="hljs-keyword">this</span>.currentTab == <span class="hljs-number">1</span>?ToolbarItemStatus.ACTIVE:ToolbarItemStatus.NORMAL
  },
  {
    value:<span class="hljs-string">"我的"</span>,
    icon: <span class="hljs-string">'resources/base/media/ic_tab_mine.png'</span>,
    activeIcon:<span class="hljs-string">'resources/base/media/ic_tab_mine_selected.png'</span>,
    action:()=&gt;{
      <span class="hljs-keyword">this</span>.currentTab = <span class="hljs-number">2</span>;
      hilog.error(<span class="hljs-number">0x01</span>,<span class="hljs-string">"yst"</span>,<span class="hljs-string">"2"</span>);
    },
    status:<span class="hljs-keyword">this</span>.currentTab == <span class="hljs-number">2</span>?ToolbarItemStatus.ACTIVE:ToolbarItemStatus.NORMAL
  }
])</code><button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button></pre></div></div>
2 回复

请参考：

第一次点击是切换到ACTIVE状态，第二次点击是在ACTIVE状态的前提下感知到click事件然后切换activeIcon。

建议试试tabs组件实现类似效果，参考：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V13/arkts-navigation-tabs-V13

目前设计即是如此，您可以等六月底版本发布可优化此问题，也可用tabs实现

针对HarmonyOS鸿蒙Next Navigation组件的Active状态和状态刷新问题，以下是一些专业解答：

  1. Active状态：

    • 在鸿蒙Next中，Navigation组件的Active状态通常指的是当前显示或处于激活状态的页面或组件。
    • 组件的active/inactive状态不等同于可见性，如堆叠布局（Stack）下被遮罩的组件虽不可见，但不视为inactive状态。

  2. 状态刷新：

    • 当NavDestination的页面显示时，会触发onShown回调，可以在此回调中执行刷新操作。
    • 如果数据源是可观察的（Observable），当数据源变化时，UI组件会自动接收到通知并更新。
    • 如果自动更新没有发生，可能需要手动触发更新，类似于其他框架中的notifyDataSetChanged()方法（具体API需参考HarmonyOS的官方文档）。

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

回到顶部