React: Kann die Eigenschaft 'getWeather' von undefined nicht lesen

Question

Ich versuche herauszufinden, woher dieser Fehlertyp kommt, aber ich kann es nicht genau lokalisieren. Vielleicht fehlt mir ein wichtiges Konzept von React.

Ich habe eine Wetter Klasse in Reaktion wie:

class Weather extends Component { 
    constructor(props) { 
    super(props); 

    this.state = { 
     cityName: "San Francisco", 
     temp: null, 
    } 
    } 

    getWeather(city) { 
    // does fetch request to openweathermap.org 
    } 

    handleSubmit(event) { 
    event.preventDefault(); 
    this.getWeather(this.state.cityName); 
    // this.state.cityName is updated as the user types 
    } 
} 

das Problem ist, wenn ich die Taste ich eine Fehlermeldung über meine GetWeather Funktion einreichen klicken bekommen sagen:

TypeError: Cannot read property 'getWeather' of undefined

Irgendwelche Empfehlungen? Ich habe versucht, die getWeather-Funktion zu binden, aber es hat nicht geholfen.

Answer 1

Sie müssen sowohl getWeather und handleSubmit binden: bezieht

constructor(props) { 
    super(props); 

    this.state = { 
     cityName: "San Francisco", 
     temp: null, 
    } 

    this.getWeather = this.getWeather.bind(this); 
    this.handleSubmit = this.handleSubmit.bind(this); 
    } 

Answer 2

In Ihrem Fall this zu Element, nicht Klasse. Verwenden Sie die Pfeilfunktion.

handleSubmit = (event) => { 
    event.preventDefault(); 
    this.getWeather(this.state.cityName); 
    // this.state.cityName is updated as the user types 
    }