javascript - TouchableOpacity onPress が反応ネイティブで機能しない

Question

CourseDetail.jsTouchableOpacity をクリックしたときに別の画面 ( ) に移動するにはどうすればよいですか。そのために使用StackNavigatorしていますが、エラーが発生していますundefined is not an object evaluating this.props.navigation。以下にコードを貼り付けます。助けてください。単純な間違いがあることは知っていますが、わかりません。

HomeScreen.js

import CourseDetail from './CourseDetail';
import { StackNavigator } from 'react-navigation';
const HomeScreen = ({course, navigation}) =>{
        const {name,featured_image,id} = course;
        const {navigate} = this.props.navigation;
        return(
            <TouchableOpacity onPress={() => navigate('CourseDetail', {id})}>
                <Card>
                    <CardSection>
                        <View style={styles.thumbnailContainerStyle}>
                             {course.term_id == '28' ? (<View></View>) : (
                             <Text style={styles.userStyle}>{name}
                             </Text> )}
                        </View>
                    </CardSection>
                </Card>
            </TouchableOpacity>
        );
    };
const ScheduledApp = StackNavigator({
    Home:{
        screen: HomeScreen
    },
    CourseDetail:{
        screen: CourseDetail
    }
});
export default HomeScreen;