React+typescript+antd 记录：input 中 onChange 事件取值问题（只能拿到上次输入的值）

input 中 onChange 事件取值问题

react input Onchange 事件不能立刻拿到值，只能拿到上次输入的值

代码：

<Input className="search-input" value={this.state.searchValue} onChange={this.handleChange}/>

handleChange(e){
	this.setState({
		searchValue: e.target.value
});
	console.log(this.state.searchValue) // 拿到的是上次输入的内容
}

原因：setState 是异步的

获取输入最后状态的值有两种方式：

• 在 setState 的回调函数中可以获取到最后状态下的输入值
• 在 search 组件的 onSearch 事件中可以获取到最后状态下的输入值

this.setState({searchValue: e.target.value}, ()=>{
 console.log('setState回调--'+this.state.searchValue) // 可以拿到正确的内容
})

Search = () => {
  console.log('点击了搜索按钮')
  console.log(this.state.searchValue) // 可以拿到正确的内容
}