Значок меню не сопоставлен с навигацией DrawerRouter — React Native Navigation

Для моего проекта я хотел бы иметь значок гамбургера (меню) в левом верхнем углу, щелкнув который, вы должны открыть DrawerRouters с левой стороны. Всего у меня есть 5 маршрутов в DrawerRouters, а именно «Вход», «Мой курс», «Все курсы», «Профиль» и «Выход». Среди этих 5 маршрутизаторов 2 («Мой курс», «Все курсы») указывают на один и тот же навигатор стека (пользовательский стек, который будет различать их с помощью screenProps).

Проблема в том, что DrawerRouter не открывается, если я щелкаю значок меню, отображаемый на каждом из 5 экранов. Я добавлю свой код и изображение ниже

Изображение страницы DrawerRoutes(MyRoutes)

Изображение страницы всего курса (Курс)

App.js

export default class AppContainer extends React.Component {
    render() {
            return (<MyRoutes/>);
    }
}

Expo.registerRootComponent(AppContainer);

MyRoutes.js

const CustomStack = createStackNavigator({
    Course,
    ModuleList,
    LessonTabs,
    SectionList,
    SectionEdit,
});

class AllCourse extends Component{
    constructor(props){
        super(props);
    }
    render(){
        return(
            <CustomStack screenProps={{courseType: 'ALL_COURSE'}}></CustomStack>)
    }
}

class MyCourse extends Component{
    constructor(props){
        super(props)
    }
    render(){
        return(
        <CustomStack screenProps={{courseType: 'MY_COURSE'}}></CustomStack>)
    }
}

const DrawerRouter = createDrawerNavigator({
        Login: {
            screen: Login,
            navigationOptions: ({navigation}) => ({
                title: 'Login Title',
            })
        },
        "My Courses": {
            screen: MyCourse,
            navigationOptions: ({navigation}) => ({
                title: 'Mycourse Title',
            })
        },
        "All Courses": {
            screen: AllCourse,
            navigationOptions: ({navigation}) => ({
                title: 'Allcourse Title',
            })
        },
        Profile: {
            screen: Profile,
            navigationOptions: ({navigation}) => ({
                title: 'Profile Title',
            })
        },
        Logout: {
            screen: Logout,
            navigationOptions: ({navigation}) => ({
                title: 'Logout Title',
            })
        }
    },
    {
        initialRouteName: 'Login',
        contentOptions: {
            activeTintColor: '#548ff7',
            activeBackgroundColor: 'transparent',
            inactiveTintColor: '#ffffff',
            inactiveBackgroundColor: 'transparent',
            labelStyle: {
                fontSize: 15,
                marginLeft: 0,
            },
        },
        drawerWidth: SCREEN_WIDTH * 0.8,
        contentComponent: CustomDrawerContentComponent,
        drawerOpenRoute: 'DrawerOpen',
        drawerCloseRoute: 'DrawerClose',
        drawerToggleRoute: 'DrawerToggle',
    }
);

const CustomDrawerContentComponent = props => (
    <View style={{flex: 1, backgroundColor: '#43484d'}}>
        <View style={{marginTop: 40, justifyContent: 'center', alignItems: 'center'}}>
            <Text>Student World</Text>
        </View>
        <View style={{marginLeft: 10}}>
            <DrawerItems {...props} />
        </View>
    </View>
);

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#3498db',
        justifyContent: 'center',
    },
});

export default class MyRoutes extends React.Component {
    render() {
        return (<DrawerRouter/>);
    }
}

Курс.js

export default class Course extends Component {
    static navigationOptions = ({ navigation}) => {
        return {
            title: "Courses",
            headerLeft: <Icon name="menu" size={70} onPress={ () => navigation.navigate('DrawerOpen') }/>,
        };
    };

    render() {
        return (<View><Text>Course Page</Text></View>);
    }
}

На странице курса значок меню вместе с заголовком отображается в заголовке, однако при нажатии на него не отображается drawerRoute с левой стороны.

1) Я использую DrawerOpen на странице курса, чтобы получить DrawerRoutes, но он не работает.

headerLeft: <Icon name="menu" size={70} onPress={ () => navigation.navigate('DrawerOpen') }/>

2) Как привязать значок меню к левому DrawerRoutes