概述:
setState通过一个队列机制实现state更新。
当执行setState时,会将需要更新的state 合并后 放入状态队列,而不会立刻更新this.state。
队列机制可以高效地批量更新state。
setState调用栈:
1.setState源码概况:
setState ->
enqueueSetState(进行状态队列_pendingStateQueue合并操作。每一个component都有一个自己的_pendingStateQueue) ->
enqueueUpdate(接收一个参数,当前component) ->
处于批量更新模式:dirtyComponents.push(component) 或
不处于批量更新模式:batchedUpdates(enqueueUpdate,component)->
batchedUpdates调用transaction.perform(参数:enqueueUpdate,component)执行队列更新函数
事务的作用:将需要执行的方法用wrapper封装起来,再用事务的perform方法执行。即:此处执行完所有wrapper中的initialize方法后,执行enqueueUpdate,再执行wrapper中所有close方法。
2.setState调用栈图示
setState简化调用栈
关于事务,注意:
整个将React组件渲染到DOM中的过程就处于一个大的事务中。此时,batchedUpdates被调用,batchingStrategy.isBatchingUpdates == true,所以在componentDidMount中调用setState,不会立即生效。