Question

我想确认一个关于功能组件和useReducer的假设。据我了解，useState是幕后的useReducer，因此在本示例中将使用useState进行简化。

function Example(){
 const [count, setCount] = useState(0);
 
 return <Button onClick={()=> setCount(c=>c+1)} >{count}</button>
}

我可以保证在调用setCount之后，下一个渲染周期将包含更新的count值。我知道可以批量处理更新，以便可以在看到渲染之前多次调用setCount，但是在应用setCount的更改之前是否可以看到渲染？

批处理更新可能会导致类似这样的情况（假设我在同一事件调用中再次调用setCount或在进行中有悬念）：

0
click => 1
click, click => 3 // 2 did not result in a render
click, click, click => 6 // 4 and 5 did not result in a render

这就是为什么使用setCount的委托重载以确保它正在修改状态的当前版本至关重要。

但是，是否有可能看到两次渲染相同的状态，一次在单击之前，一次在之后：

0
click => 0
1
click => 2

在上面的示例中，计数从0开始，我单击了（调用setCount），但是随后在“应用” setCount之前看到一个旧的“排队”渲染。因此，即使单击并调用setCount，我也看到了一个旧的渲染，然后看到由setCount触发的新值。这是否可能，或者可以安全地假设我将永远不会看到比最后一次setCount调用中的值还早的值的渲染器。

React useReducer挂钩和功能组件生命周期保证

0 个答案: