React: 個別のイベント内に状態を設定すると、クリーンアップが実行されますか?

問題は、タイマー自体が個別のイベントではないことです。 離散イベントは、他の離散イベントに関してのみ保証されます。 私はそれがあなたがここで望んでいるとは思わない.

すべての設定状態が非同期であるため、タイマーの停止は非同期操作です。 そのため、フラッシュされる前に別のものが入ってくる可能性があります。

これは、useLayoutEffect が実際に問題を完全に解決しない場合です。 確かに同時モードではありませんが、これは同期モードでも大雑把です。 タイマーではなくフォーカス イベントだとすると、これがフラッシュされる前にバッチ内で発生する可能性があり、同じ問題が発生します。

setRunning(false); // I would like to add a stop of this timer to the queue to be performed later
setLapse(0); // I would like to add an operation to set lapse to zero later
// lots of random stuff that can happen before the batch flushes
// This might also queue an operation to set lapse to something else
// actual rendering
// If concurrent mode, lots of other random stuff that can happen while rendering
// This might also queue an operation to set lapse to something else
// Actually do all that work in order

キューに追加される順序がすべてです。

1 つのアプローチは、タイマーが実際に停止した場合、つまり実際に停止した場合にのみリセットをディスパッチすることです。 同じフレームで常にゼロを表示する場合は、実行が false のときに常にゼロを表示できます。

ただし、ほとんどの場合、これはリデューサーとしてより適切にモデル化されます。 レデューサーは、停止状態にあると判断した場合、更新の失効を簡単に拒否し、ロジックを実行して実際にリセットすることもできます。

わかった。 ありがとう。

https://mobile.twitter.com/dan_abramov/status/1104069236132057089
https://codesandbox.io/s/23m1659rlp