перемещение в верхнюю часть стека (родительский экран) во вложенной навигации

#reactjs #react-native #android-studio #react-navigation

#reactjs #react-native #android-studio #react-навигация

Вопрос:

У меня есть несколько createStackNavigator для разных экранов, и я использую их в своем, createBottomTabNavigator чтобы все экраны были доступны с других экранов, проблема заключается в том, что когда я перехожу на главный экран в моем createBottomTabNavigator , если я открываю любой из других экранов, таких как экран контактов createStackNavigator , затем, если я перехожу на экран профиля в моем createBottomTabNavigator , а затем, если яснова вернитесь к главному экрану, затем вместо того, чтобы видеть главный экран, я все еще вижу экран контактов (поскольку он находится на вершине стека) Я должен снова нажать на home, чтобы он привел меня туда.

Это связано с тем, что я использую вложенные навигации, я не совсем уверен, как перейти непосредственно к главному или любым другим экранам, createBottomTabNavigator а не к каким-либо экранам createStackNavigator .

это пример того, что я имею в виду:

 const HomeStack = createStackNavigator();
const Home = () => {
  return (
    <HomeStack.Navigator
      initialRouteName="Home"
      screenOptions={{
        headerShown: false,
      }}
    >
      <HomeStack.Screen name="Home" component={HomeScreen} />
      <HomeStack.Screen
        name="SearchScreen"
        component={SearchScreen}
      />
      <HomeStack.Screen name="ContactScreen" component={ContactScreen} />
      <HomeStack.Screen name="FavoriteScreen" component={FavoriteScreen} />
    </HomeStack.Navigator>
  );
};

const HelpStack = createStackNavigator();
const Help = () => {
  return (
    <HelpStack.Navigator
      initialRouteName="Help"
      screenOptions={{
        headerShown: false,
      }}
    >
      <HelpStack.Screen
        name="SearchScreen"
        component={SearchScreen}
      />
      <HelpStack.Screen name="ContactScreen" component={ContactScreen} />
      <HelpStack.Screen name="FavoriteScreen" component={FavoriteScreen} />
    </HelpStack.Navigator>
  );
};

const ProfileStack = createStackNavigator();
const Profile = () => {
  return (
    <ProfileStack.Navigator
      initialRouteName="CreateProfile"
      screenOptions={{
        headerShown: false,
      }}
    >
     <ProfileStack.Screen
        name="SearchScreen"
        component={SearchScreen}
      />
      <ProfileStack.Screen name="ContactScreen" component={ContactScreen} />
      <ProfileStack.Screen name="FavoriteScreen" component={FavoriteScreen} />
    </ProfileStack.Navigator>
  );
};

const Tab = createBottomTabNavigator();
const MainTabs = () => (
  <Tab.Navigator
    initialRouteName="Home"
  >
    <Tab.Screen
      name="Home"
      component={Home}
    />
    <Tab.Screen
      name="Help"
      component={Help}
    />
    <Tab.Screen
      name="Profile "
      component={Profile}
    />
  </Tab.Navigator>
);
 

Итак, я перехожу к домашнему компоненту, а затем оттуда перехожу к экрану профиля, затем, если перейти к экрану справки, затем, если я нажму «Домой», я перейду на экран профиля вместо главного экрана, как я могу убедиться, что этого не произойдет, потому что это немного сбивает с толку. У меня createBottomTabNavigator вкладки видны на всех других экранах, поэтому мне нужно перейти непосредственно к корневому экрану.

Комментарии:

1. Привет, возможно, что-то вроде popToTop возврата к корню? reactnavigation.org/docs/navigating

2. @IronMan Я мог бы использовать его, если бы использовал кнопку, но вкладки находятся в createBottomTabNavigator, и я думаю, что оттуда я должен что-то сделать. потому что у меня есть createBottomTabNavigator, который также виден на каждой странице.