javascript - 如何在 React Native 中有条件地渲染屏幕但将其放置在堆栈上？

Question

我有这个：

  const initialRouteName = leagueId ? 'League' : 'Leagues'
  return (
    <Stack.Navigator initialRouteName={initialRouteName}>
      <Stack.Screen
        name="Leagues"
      >
        {(props: any) => <MyLeagues navigation={props.navigation} theme={theme} />}
      </Stack.Screen>

      <Stack.Screen
        name="League"
      >
        {(props: any) => {
          return <League leagueId={leagueId} theme={theme} />
        }}
      </Stack.Screen>
    </Stack.Navigator>

现在这有效（有点）。我已经改变了这种行为，当我使用 PN（如果leagueId存在）时，它会将用户“导航”到正确的屏幕。

但是，如果您单击启动此堆栈的选项卡，则该行为将返回到Leagues屏幕。它现在没有这样做，因为我已经将它设置initialRouteName为League，所以我猜Leagues它不在堆栈上。有没有办法确保我League最初渲染屏幕（如果leagueId存在）但也允许它返回？如果这有意义

标签： javascriptreactjsreact-nativereact-navigation