使用 Expo 路由器更改选项卡后如何弹出堆栈顶部？

Question

我正在使用expo路由器。 我有一个嵌套在选项卡导航器内的堆栈导航器。这是我的设置。

选项卡 1：屏幕 1
选项卡 2：屏幕 2
选项卡 3：堆栈导航器

如果我深入浏览选项卡 3 上的堆栈导航器，然后单击其他选项卡之一（例如选项卡 1），然后单击返回堆栈导航器，expo 路由器将维护该堆栈的位置。但我希望它回到堆栈的顶部。

通过 React 导航，我们有 tabBarOnPress 选项，它允许我们将堆栈弹出到顶部（请参阅 stackoverflow article）。但是expo路由器好像没有这个。

有人可以帮助我使用 expo 路由器实现此行为吗？

Answer 1

expo-router

的 tabs 包装了 React Navigation 中的底部选项卡。

因此，您可以通过使用

umounntOnBlur

并将其设置为

true

来实现此行为。

有关

umountOnBlur

的更多信息可以在

bottom-tab-navigator

docs

中找到

<Tabs
  screenOptions={{
    // for all tabs
    unmountOnBlur: true,
    ...
  }}
>
  <Tabs.Screen
    name="someScreen"
    options={{
    // only for this specific tab
    unmountOnBlur: true,
    ...
  }}
  />
</Tabs>

Answer 2

现在改为 popToTopOnBlur 而不是 unmountOnBlur 所以在选项上设置 popToTopOnBlur: true