I have a react native app with a DrawerNavigator. For the menu I have my own component. That works great. Now I want to add a second side menu on the right side. Is it possible to have two DrawerNavigator like in the Slack App? This solution is not working for me: https://snack.expo.io/ry7lYempe because I don't want to have a TabController as parent. Both Drawer should be accessible in all screens.
My code looks like this:
import React from 'react'
import reducer from './src/reducers'
import { DrawerNavigator } from 'react-navigation';
import SidebarMenu from './src/components/layout/SidebarMenu'
import { createStore } from 'redux';
import { Provider } from 'react-redux';
let store = createStore(reducer);
import News from './src/screens/News'
import HowTo from './src/screens/HowTo'
export default class MyApp extends React.Component {
render() {
return (
<Provider store={store}>
<MainNavigator />
</Provider>
);
}
}
const MainNavigator = DrawerNavigator(
{
News: {
path: '/news',
screen: News
},
HowTo: {
path: '/howto',
screen: HowTo
}
},
{
initialRouteName: 'News',
drawerPosition: 'left',
contentComponent: SidebarMenu
}
);
Solved after updating react-navigation to the newest version.
you can add any drawer you want, take a look at this exemple https://snack.expo.io/BJoChzewM
In your case, you may add your "MainNavigator" in another DrawerNavigator Component. don't forget to set drawerOpenRoute/drawerCloseRoute to prevent any side effects.