Question

我有一个在输入字段中更改时触发的处理程序。但是，当我将状态记录到控制台时，resData是'undefined'？这是不可能的，因为console.log（正文）确实返回结果。

handlePersonNameChange(event) {
var resData
request('https://swapi.co/api/people/?search='+event.target.value, function (error,response,body) {
  console.log(body)
  resData = body
})
this.setState({personData: resData});
console.log(this.state)
}

Answer 1

请求调用是asynchrone，您应该将this.setState放在响应正文中。

同样this.setState是asynchrone，要查看应该使用回调函数的结果。在设置新状态后调用此函数。

handlePersonNameChange(event) {
  var resData
  request('https://swapi.co/api/people/?search='+event.target.value, 
  function (error,response,body) {
    console.log(body)
    resData = body
    this.setState({personData: resData}, function() {
      console.log(this.state)
    })
  })
}

有关this.setState()的更多信息，请访问here

Answer 2

您需要在请求回调中setState，例如：

request('https://swapi.co/api/people/?search='+event.target.value, function (error,response,body) {
  console.log(body)
  resData = body
  this.setState({personData: resData});
})

因为在您的示例中执行setState时，您的请求未被撤销。

Answer 3

this.setState({ state : "new1" })

此方法不同步，因此当您记录状态时，它尚未更新。

您应该在componentWillUpdate生命周期方法中记录它。

在setState之后反应状态是否未定义？

3 个答案: