reduxを使用して連続または高速で繰り返す操作を処理する方法

Question

Reduxで連続してすばやく繰り返す操作を処理する最善の方法を検討しようとしています。

例えば、私はRGBの値を表す一連のスライダを持っていて、私の状態のコンポーネントはこれらのスライダのアクションによって設定されたColorです。

ユーザーはスライダを行き来することができますが、変更するたびに新しい動作を開始すると、スライダがはじけることがあります。たとえば、ユーザがRedスライダを操作している可能性があります。 1つのアクションを0.5の値でディスパッチすることができ、ユーザーは1.0に非常に素早くスライドします。状態の更新が戻ってくるまでに、ユーザーは1.0になっていますが、状態の更新は0.5、すぐ後に1.0イベントが続きます。

結果は、ジャンプバックして前方にジャンプするスライダーノブになります。質問のために、そうであると仮定してみましょう。

とにかく、私はそのようなことを防ぐ方法が不思議です。私の最初の本能は、アクションをデバウンスし、それに応じてビューを更新することです。そして、デバウンスされたアクションが最終的に起動すると、ユーザーが停止したことを意味します。したがって、新しい値Colorが状態から来ると、それらは等しくなり、何も変更されていないように見えます。

これはこのようなものを処理する正しい方法ですか、何か不足していますか？

Answer 1

また、コンポーネント状態を介してローカルにアップデートを処理し、Reduxアクションのディスパッチを実行することは絶対に実行可能な戦略です。私は実際に私のブログ投稿Practical Redux, Part 7: Form Change Handling, Data Editing, and Feature Reducersでこれについて議論しました。ここでは、再利用可能なジェネリックフォーム入力バッファリングコンポーネントを紹介します。