Home > Net >  Can I use only Drawer and Tab Navigator without creating Stack Navigator in React?
Can I use only Drawer and Tab Navigator without creating Stack Navigator in React?

Time:08-01

The question is simple. I didn't see any example usage, therefore I am asking. Many thanks in advance..

CodePudding user response:

The short answer is "Yes, you can!"

The long answer is "This is not practical"

You can create TabNavigator and DrawerNavigator only and call the TabNavigator inside DrawerNavigator in NavigationContainer, something like this:

import Tabs from "./src/navigation/tabs";
//....

render() {
    return (
      <NavigationContainer>
        <Drawer.Navigator initialRouteName="Tabs"drawerContent={(props) => (<DrawerContent {...props} />)}>
          <Drawer.Screen name="Tabs" component={Tabs} />
        </Drawer.Navigator>
      </NavigationContainer>
    );
  }

But here if you have suppose 3 tabs - Home, Profile, Settings, and you want multiple pages inside each tabs, for example:

Home >> Dashboard, Notifications

Profile >> View Profile, Edit Profile

Settings >> General Settings, Notification Settings, Contact Us

At such situation, StackNavigator will be required so that each tab will have stack of multiple screens.

  • Related