Question

我正在使用jquery制作GET request to a quiz API。我正在使用React向用户显示问题，如果问题正确，我想触发API请求并获取新问题。

如果用户得到正确的答案，我试图触发发出GET请求的函数，但是控制台告诉我this.serverRequest is not a function

我昨天才开始学习反应，原谅任何可怕的错误，但也可以随时提供有关如何改进代码的反馈。

请参阅下面的代码，希望能够更清楚地说明我所面临的问题。

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()
},

重新触发GET请求在某些条件下发生反应

1 个答案: