抽屉未导航到React Native Navigation 5中的下一个屏幕

Question

我正在使用带有导航5的React Native抽屉，我已经创建了一个抽屉，但是当我单击某个选项导航到下一个屏幕时，从抽屉中出现了这样的错误，例如“ Undefined is not object..this.props”，以及我像const navigation = this.props.navigation一样在顶部定义prop，然后出现错误“导航未定义...”这是放置我的内容的抽屉：

export function DrawerContent(props) {
  return (
    <DrawerContentScrollView {...props}>
      <View
        style={
          styles.drawerContent
        }
      >
        <View style={styles.userInfoSection}>
          <Avatar.Image
...            
/>
        </View>
        <Drawer.Section style={styles.drawerSection}>
          <DrawerItem
            label="Preferences"
            onPress={() => {}}
          />
          <DrawerItem
            label="Classes"
            onPress={() => this.props.navigation.navigate('ClassHome')} //Over Here I want to navigation
          />
        </Drawer.Section>
      </View>
    </DrawerContentScrollView>
  );
}

这是放置抽屉屏幕的位置：

import * as React from 'react';
import { createDrawerNavigator } from '@react-navigation/drawer';
import HomeTimeTable from './HomeTimeTable';
import {DrawerContent} from './DrawerContent';
import ClassHome from './ClassHome';
const Drawer = createDrawerNavigator();
export default class DrawerScreens extends React.Component {
    render(){
    return (
        <Drawer.Navigator drawerContent={() => <DrawerContent navigation = {this.props.navigation} />}>
        <Drawer.Screen name="HomeTimeTable" component={HomeTimeTable} />
        <Drawer.Screen name="ClassHome" component={ClassHome} />
      </Drawer.Navigator>
    );
  }
  }

Answer 1

根据documentation，默认情况下应将导航