react-native - Screen navigate from stacknavigator not showing bottomtabnavigator

Question

i've got a bottomtabnavigator and a stacknavigator. When i navigate to a screen in stacknavigator, bottomtabnavigator is not showing in the screen. is there a way to show the bottomtabnavigator in screens from stacknavigator?

Below is my navigator codes:

const TabNavigator = createBottomTabNavigator(
  MainTabNavigator
);

const stackScreens = createStackNavigator({
    profile: {screen: ProfileScreen},
    loginform: {screen: LoginFormScreen},
    merchant: {screen : merchantScreen},
    registerform: {screen: RegisterFormScreen},
    offer:{screen: offerScreen},
});

const navigator = createStackNavigator({
    TabNavigator,
    stackScreens,
});

标签： react-nativereact-navigation

Answer 1

This is taken from the react navigation documentation and it gives a good example of how to combine stackNavigators and tabNavigators

see the full snack for a working example

const HomeStack = createStackNavigator({
  Home: { screen: HomeScreen },
  Details: { screen: DetailsScreen },
});

const SettingsStack = createStackNavigator({
  Settings: { screen: SettingsScreen },
  Details: { screen: DetailsScreen },
});

export default createAppContainer(createBottomTabNavigator(
  {
    Home: { screen: HomeStack },
    Settings: { screen: SettingsStack },
  },
));