调度动作后的应用程序状态更改
问题描述:
我正在尝试使用setState更改状态,然后使用新状态调用动作,但React在设置新状态之前调度动作。我该如何等待新状态,然后发出行动?调度动作后的应用程序状态更改
addressInput = e => {
this.setState({
address: e.target.value
});
this.props.filterSearch(this.state.address) //this will be called before state is set
}
答
this.setState
提供回调作为第二个参数,它在状态改变发生后被调用。您应该使用回调如下
addressInput = e => {
this.setState({
address: e.target.value
},
this.props.filterSearch(this.state.address));
}
从docs:
的setState()不总是立即更新组件。它可能会批处理或推迟更新,直到稍后。这使得在调用setState()之后立即读取this.state是一个潜在的缺陷。相反,使用componentDidUpdate或setState回调函数(setState(updater,callback)),其中的任何一个在应用更新后都会保证触发。