我可以确定下一次React渲染时将使用最新状态值吗?

时间:2019-03-25 19:36:39

标签: reactjs react-hooks

React文档中有很多地方说,React可以使一批状态更改入队,并在以后再进行一次。

React Component Docs

  

setState()使更改进入组件状态,并告知React   该组件及其子组件需要使用   更新状态。这是您用来更新用户的主要方法   界面以响应事件处理程序和服务器响应。

     

将setState()视为请求而非直接命令   更新组件。为了获得更好的感知性能,React可能会   延迟它,然后在一次通过中更新几个组件。反应   不保证状态更改会立即应用。

     

setState()并不总是立即更新组件。它可能   批处理或将更新推迟到以后。这使得阅读this.state   在调用setState()之后立即发生潜在的陷阱。相反,使用   componentDidUpdate或setState回调(setState(updater,   回调)),保证在更新后都会触发   已应用。如果您需要根据之前的状态设置状态   状态,请阅读下面的updater参数。

React Hooks API Reference

  

基本挂钩-useState

     

const [state, setState] = useState(initialState);

     

返回一个有状态值,以及一个更新它的函数。

     

在初始渲染期间,返回的状态(状态)与   作为第一个参数(initialState)传递的值。

     

setState函数用于更新状态。它接受一个新的   状态值,并使组件重新呈现。

问题1

我的问题是:无论React决定在单个批处理中执行多少状态更新,我是否可以依靠下一个渲染将使用最新状态的事实,以及自上次渲染以来排队的所有更新?

问题2

我可以依靠React决定排队的那些状态变化的顺序吗?我的意思是,如果我先setState({a:1}),然后再setState({a:2}),我可以确定我的州的最终价值将是2吗?

1 个答案:

答案 0 :(得分:1)

问题1:不,React只能渲染(例如)更新队列的一半,然后渲染其他。

问题2:是。处理更新的顺序可能不像您调用setState的顺序那样简单,但是最后,插入顺序才是决定状态的最新版本的方式。

react code中的详细说明。