Reactjs 反应状态值不等于this.state.nameOfState

我很难得到这个州的确切价值。出于某种原因，组件状态和状态调用之间似乎存在延迟

constructor(props){
    super(props);
    this.state = {
        name: "",
        lastname: ""
    };
    this.handleChange = this.handleChange.bind(this);
}

我有两个

input

，它用

onChange

更新状态：

<input name="name" defaultValue={this.state.name} onChange={this.handleChange} /><br/>
<input name="lastname" defaultValue={this.state.lastname} onChange={this.handleChange} /><br/> 

handleChange = (event) => {
    this.setState({[event.target.name]: event.target.value});

    console.log(this.state.lastname);
}

除了在

handleChange

中尝试获取状态值外，其他一切似乎都正常工作。例如，如果用户为

name

键入“ABCDE”，为

lastname

键入“12345”，如果我使用开发工具检查组件，则状态显示：

 name : "ABCDE",
 lastname: "12345"

但是在

handleChange

中，

console.log（this.state.lastname）

说：

1234

---

似乎每次键入的最后一个字母都会丢失，即使您可以在

状态中清楚地看到它。如何修复此问题？
react中的设置状态是异步的，因此您看不到最新的值。
如果要对其进行控制台操作，请将callback用作
setState

handleChange = (event) => {
    this.setState({[event.target.name]: event.target.value}, () => console.log(this.state.lastname));


}

这背后的原因是
这个.setState
是异步的。如文件所述：

setState（）
将更改排入组件状态队列，并告知React需要使用更新的状态重新呈现此组件及其子组件

React不保证立即应用状态更改

为了反映这些更改，我建议按如下方式呈现
lastName
的值，而不是使用
console.log（）
进行检查：

render（）{
返回(
{this.state.lastname}




)
}

然后在UI上，您将看到状态的当前值

constructor(props){
    super(props);
    this.state = {
        name: "",
        lastname: ""
    };
    this.handleChange = this.handleChange.bind(this);
}

我希望这有帮助
 问题是，我正在使用
console.log（）
检查
状态
，然后最终将这些值用于
获取
。这是否意味着我必须在
render（）中
fetch
？我可以请您在这里看一个与react.js相关的问题吗？