如何在抽屉导航中创建菜单图标?反应本机

How to create a menu Icon in a drawer navigation? React Native

我在 Stack Navigator 中嵌套了一个 Drawer Navigator,它运行良好并且在我滑动它时打开,我想在它上面放一个菜单图标,当它被按下时抽屉打开。我尝试的每种方法总是以 navigation can't be found 错误结束。

这是我的代码:

export class App extends Component {
.....

 function DrawerNav() {
      return (
        <Drawer.Navigator 
        drawerType="front" 
        initialRouteName="Main" drawerPosition="right">

            <Drawer.Screen name="Main" component={MainScreen} />
            <Drawer.Screen name="Wallet" component={WalletScreen} />
            <Drawer.Screen name="Appointments" component={Appointments} />
        </Drawer.Navigator>
               );}
   
      
  return ( 
       <Provider store={store}>
       
  

        <NavigationContainer>
        <Stack.Navigator initialRouteName="Menu">
          
           <Stack.Screen name="Menu" component={DrawerNav}  />
           <Stack.Screen name="Add" component={AddScreen}   navigation={this.props.navigation}/>
            <Stack.Screen name="Save" component={SaveScreen}  navigation={this.props.navigation}/>
           
        </Stack.Navigator>
        </NavigationContainer>
         
      </Provider>
          )}}

我想在按下这个图标时打开和关闭抽屉:

<MaterialIcons name='menu' size={28} onPress={??} />

this.props.navigation.openDrawer()} />