首页 > 解决方案 > 如果对多个 setState 调用进行批处理,prevState 如何保持更新的值而 state 不是

问题描述

react-js 的新手。

最近,浏览了关于以下案例的博客

情况1:

state = {
count :1 
}

L1: this.setState({count:this.state.count +1});
L2: this.setState({count:this.state.count +1});
L3: ..Multiple Times..

Value of count is 2

案例二:

state = {
count :1 
}

L4: this.setState(prevState => ({count:prevState.count+1})); 
L5: this.setState(prevState => ({count:prevState.count+1}));
L6: ..Multiple Times..

Value of count is > 3

根据文档,多次调用 setState 将排队等待批量更新(也有预期)。

所以根据我的理解,prevState 只不过是当前状态的 prevState。

这让我想到,

Q1. If the state is not holding the updated value (case 1), then how
the prevState (case 2) will hold the updated value?

有人可以在这里澄清吗?

标签: javascriptreactjs

解决方案


当您调用 setState 时,状态不会更新,直到循环完成。所以一定要在代码末尾调用 setState 。


推荐阅读