设置状态后反应状态未定义？[副本]

Question

我有一个处理程序，在输入字段发生变化时触发。但是，当我将状态日志记录到控制台resData是'未定义'？这是不可能的，因为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

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

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

您应该将其登录到componentWillUpdate生命周期方法中。

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放在响应体中。

另外，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（）的更多信息，请参见此处