setState 之后 React 状态未定义？

Question

我有一个在输入字段发生变化时触发的处理程序。但是，当我将状态记录到控制台时，resData 是“未定义”？这是不可能的，因为 console.log(body) 确实返回结果。

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

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

也是this.setState异步的，要查看结果你应该使用回调函数。设置新状态后调用此函数。

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()请参阅此处