this.setState keine Funktion Schienen

Question

componentDidMount() { 
    $.ajax({ 
     type: "GET", 
     url: "/tweets", 
     dataType: "json", 
     success: function (data){ 
      //$('#tweetsList').append(data); 
      this.setState({tweetsList: data}); 
     }, 
     error: function (error) { 
      console.log(error); 
     } 
    }); 
} 

der obige Code-Block gibt mir eine this.setState Funktion nicht gefunden Fehler. Ich versuche, Json von meinem Tweets-Controller zu meiner main.jsx-Datei zu rendern.

Answer 1

Der Kontext von this ändert sich im Ajax-Aufruf. this bezieht sich nicht mehr auf Ihre Komponente. Sie müssen auf den ursprünglichen Kontext verweisen.

componentDidMount() { 
    const self = this; 
    $.ajax({ 
     type: "GET", 
     url: "/tweets", 
     dataType: "json", 
     success: function (data){ 
      //$('#tweetsList').append(data); 
      self.setState({tweetsList: data}); 
     }, 
     error: function (error) { 
      console.log(error); 
     } 
    }); 
} 

Answer 2

Das Problem ist this in Ihrem Erfolg Callback-Funktion bezieht sich auf die Funktion und daher keine setState Methode hat. Sie können Kontext jQuery Ajax-Aufruf wie folgt passieren:

$.ajax({ type: "GET", url: "/tweets", dataType: "json", context: this, success: function (data){ //$('#tweetsList').append(data); this.setState({tweetsList: data}); }, error: function (error) { console.log(error); } });

jQuery ajax docs über Kontexteigenschaft Siehe für weitere Informationen.