what I'm trying to achieve is the ability to open and close the drawer menu from within the bottom tab bar. Currently, my bottom tab bar code looks as follows:
function BottomTabNavigator() {
return (
<NavigationContainer>
<Tab.Navigator screenOptions={{
headerShown: false
}}>
<Tab.Screen name="SearchScreen" component={SearchScreen} />
<Tab.Screen name="DrawerNavigation" component={DrawerNavigation}
listeners={({ navigation }) => ({
tabPress: e => {
e.preventDefault();
navigation.closeDrawer();
}})}/>
<Tab.Screen name="DrawerNavigationShowMenu" component={DrawerNavigation}
listeners={({ navigation }) => ({
tabPress: e => {
e.preventDefault();
navigation.openDrawer();
}})}/>
</Tab.Navigator>
</NavigationContainer>
);
}
I would like the second and third elements to respectively hide and show the drawer menu (currently, they just navigate between two instances of DrawerNavigation), right now it gives me error 'navigation.openDrawer is not a function'. How could I achieve my goal?