React:如何强制状态更改在 setState 之后发生
React: how to force state changes to take place after setState
调用 setState 后如何强制在 React 中进行状态更新?
据我所知,下次调用渲染时,状态会有效更新。另外,forceUpdate()
应该重新渲染组件并立即更新状态更改,对吗?然而,情况似乎并非如此。下面是一个示例。
handleSomeEvent(data) {
this.setState({
data: data
})
this.forceUpdate()
// At this point state should be updated but it isn't
this.props.consumeData(this.state.data) // consumeData will receive old data
}
如何确保在调用 consumptionData 之前实际更新状态?
> setState()
是异步的,因此您可以在回调中执行此操作:
handleSomeEvent(data) {
this.setState({
data: data
}, () => this.props.consumeData(this.state.data)); // using `data` would work as well...
}
关于访问刚刚更改的状态,@Samuli Hakoniemi 的答案是文档中的首选方式 (iirc)。
我想说以下代码也应该在数据处理之前运行状态更改:
handleSomeEvent(data) {
const _handleDataChange = async () => {
this.props.consumeData(this.state.data)
}
this.setState({data: data})
_handleDataChange();
}
由于_handleDataChange是异步调用,因此应在(异步)setState 调用之后运行。
相关文章:
- electronic BrowserWindow的最小高度和宽度在hide()show()方法之后不起作用
- 在chrome.tabs.onCreated之后加载HTML页面
- 在Jquery detachment()和appendTo()之后定位元素
- AngularJS:ng之后,重复$scope值未按预期更新
- 为什么元素的宽度在页面加载之后和那一刻之后不同
- 没有在Angular应用程序中定义firebase(在firebase迁移之后)
- Javascript复选框函数:;缺少:在属性id之后"
- 在刚刚调用的append函数之后,jquery.height()不会返回实际值
- 无法在现有状态转换期间更新-未使用任何非法的setState()
- 正在链接添加了以下内容::在之后
- JQuery hide()在show()之后不起作用,反之亦然
- 未执行Ajax循环的Javascript之后的代码
- 如何在`window.open`之后执行回调
- 如何在一个元素动画之后延迟
- 在XMLHttpRequest之后重新初始化jQuery
- React不会在promise中使用的setState之后重新应答
- 我可以在renderComponent之后立即调用setState吗?
- 子组件不会在setState之后使用新的props进行更新
- 在setState之后落后的一个状态
- React:如何强制状态更改在 setState 之后发生