Получение undefined не является объектом (оценка «this.props.url»)

Я пытаюсь создать компонент в своем приложении, который будет отображать имя со ссылкой на веб-сайт, и, похоже, получаю сообщение об ошибке Getting undefined is not an Object ( evaluating 'this.props.url'). Я попытался исправить это, добавив .bind(this), но это приводит либо к синтаксической ошибке, либо к той же ошибке.

Вот код компонента

    import React, { Component } from "react";
    import { Linking, Text, StyleSheet, TouchableHighlight } from "react-native";

    const styles = StyleSheet.create({
     sciName: {
      textAlign: "center",
      fontWeight: "bold",
      color: "black"
     }
    });

    class LinkedName extends Component<Props> {
      render() {
        const { latinName } = this.props;

        return (
          <TouchableHighlight
            onPress = {this.goToUrl}
            hitSlop = {{ top: 50, left: 50, bottom: 50, right: 50 }}
          >
            <Text style = {styles.sciName}>{latinName}</Text>
          </TouchableHighlight>
        );
     }

     goToUrl() {
       const { url } = this.props;
       Linking.canOpenURL(url)
         .then(supported => {
           if (supported) {
             Linking.openURL(url);
           } else {
             alert("cannot open this link");
         }
       });
     }
    }

    export default LinkedName;