GETリクエストの再トリガー特定の条件で反応する

Question

jqueryを使用してGETrequest to a quiz APIを作成しています。 Reactを使用してユーザーに質問を表示していますが、質問が正しい場合はAPIリクエストをトリガーして新しい質問を取得します。

しかし私は、コンソールは、私が唯一の学習が、昨日はそうどんなひどいの誤差はご容赦反応するだけでなく、感じ始めているthis.serverRequest is not a function

私に語った、ユーザーが正しい答えを取得する場合GET要求を行う機能を起動しようとしていますコードをどのように改善できるかについて、自由にフィードバックを提供することができます。

私が直面している問題をより明確にするために、以下のコードをご覧ください。

var Quiz = React.createClass({ 

    getInitialState: function() { 
     return { 
      question: '', 
      answer: '', 
      score: 0 
     } 
    }, 

    checkAnswer: function(event) { 
    if(event.target.value === this.state.answer) { 
     this.setState({ 
      score: this.state.score + 1 
     }) 
     this.serverRequest; 
    } 
    }, 

componentDidMount: function() { 
    this.serverRequest = $.get('http://jservice.io/api/random', function(data){ 
     var response = data[0]; 

     this.setState({ 
      question: response.question, 
      answer: response.answer 
     }) 
    }.bind(this)); 
}, 

    render: function() { 
     return (
      <div> 
       <p>{this.state.question}</p> 
       <input type='text' onChange={this.checkAnswer}/> 
       <p>{this.state.score}</p> 
      </div> 
    ) 
    } 
}); 

Answer 1

これが完成しました。

getリクエストを別の方法に移動し、theComponentDidMountメソッドで呼び出しました。

getData: function() { 
    $.get('http://jservice.io/api/random', function(data){ 
     var response = data[0]; 
     console.log(response) 

     this.setState({ 
      question: response.question, 
      answer: response.answer 
     }) 
    }.bind(this)); 
}, 

componentDidMount: function() { 
    this.serverRequest = this.getData() 
},