![]() |
1
427
我在React上工作。 TLDR:
对
对 这个 顺序 始终尊重更新的数量。您是否看到它们之间的中间状态取决于您是否在批中。 在React 17及更早版本中, 默认情况下,仅批处理React事件处理程序中的更新 . 当您需要时,有一个不稳定的API可以强制在事件处理程序之外批处理罕见的情况。
从React 18开始,React
batches all updates by default
.
请注意,React永远不会批处理来自两个不同故意事件(如单击或键入)的更新,因此,例如,两个不同的按钮单击永远不会批处理。在极少数不需要分批的情况下,可以使用
理解这一点的关键是
不管有多少
在你的两个例子中,
更新总是
按照发生的顺序进行浅合并
. 所以如果第一次更新是
这个
在您的示例中,我们不会看到“中间状态”,因为我们是 在React事件处理程序中 启用批处理的位置(因为React“知道”何时退出该事件)。
然而,在React 17和早期版本中,
默认情况下,在React事件处理程序之外没有批处理
. 因此,如果在您的示例中,我们有一个AJAX响应处理程序,而不是
我们意识到这很不方便 根据您是否在事件处理程序中,行为会有所不同 . 在React 18中,这不再是必要的,但在此之前, 有一个API可以用来强制批处理 :
内部React事件处理程序都打包在
这个API是“不稳定的”,因为我们最终会在18岁以后(19岁或更高)的一些主要版本中删除它。如果在某些情况下需要在React事件处理程序之外强制批处理,则在React 18之前可以安全地依赖它。使用React 18,您可以删除它,因为它不再有任何效果。 总之,这是一个令人困惑的话题,因为默认情况下,React只用于事件处理程序内部的批处理。但解决办法不是 无批次 ,是为了 批量更多 默认情况下。这就是我们在React 18中所做的。 |
![]() |
2
9
这实际上是一个很有趣的问题,但答案不应该太复杂。有一个很棒的 article on medium 这有一个答案。 1) 如果你这样做
我不认为会有这样的情况
然而
如果
处理完上述所有通话后
文章中提到了这一点:
这将给我们
|
![]() |
3
4
同一周期内的多个调用可以批处理在一起。例如,如果您试图在同一周期内多次增加一个物料数量,则将导致等同于:
|
![]() |
Softly · 单选按钮未按预期取值 1 年前 |
|
SlickRed · 我无法使用JS关注HTML元素 1 年前 |
![]() |
assembler · Nextjs没有处理发布请求 1 年前 |
|
BADRUM · 执行两个获取功能后,如何导航回页面? 1 年前 |
![]() |
Toniq · javascript为php保存多维数组 1 年前 |