Как мне вложить навигатор ящиков внутри страницы, которая существует внутри стека?

Question

Я хочу создать небольшое собственное приложение с несколькими экранами: Вход и Домой. Тем не менее, я также хотел бы иметь навигатор ящика, прикрепленный к главному экрану. Ящик будет содержать 3 дополнительных экрана: Регистрация устройства, Звонок и Проверка звука. Пока что мой файл App.js выглядит так

import { StackNavigator, DrawerNavigator } from 'react-navigation';

import Login from './src/components/Login';
import SignUp from './src/components/SignUp';
import DeviceRegistration from './src/components/DeviceRegistration';
import Call from './src/components/Call';
import Sound from './src/components/Sound';



export const Navigation = StackNavigator({
  Login: { screen: Login },
  SignUp: { screen: SignUp },
  DeviceRegistration: { screen: DeviceRegistration },
  Call: { screen: Call },
  Sound: { screen: Sound },
}, 
    {
  headerMode: 'none',
  initialRouteName: 'Login'
    } 

);


export const Drawer = DrawerNavigator({
    DeviceRegistration: { screen: DeviceRegistration },
    Call: { screen: Call },
    Sound: { screen: Sound },
}, {


});

export default Navigation;

Где я могу разместить ящик внутри главного экрана, чтобы я мог создать значок гамбургера, который я могу нажать для доступа к навигации в ящике?

Answer 1

export const Drawer = DrawerNavigator({
    SignUp: { screen: SignUp },
    DeviceRegistration: { screen: DeviceRegistration },
    Call: { screen: Call },
    Sound: { screen: Sound },
});

export const Navigation = StackNavigator({
  Login: { screen: Login },
  Home: { screen: Drawer },
});

Затем в вашем Signup компоненте вызовите this.props.navigation.navigate('DrawerOpen'), чтобы открыть ящик.