React でカウンターをアニメーション化する方法を探しています。

例として、次の構造を持つ 3 つのコンポーネントがあります:

＃＃＃マスター： ＃＃＃
• 論理コンポーネント
＃＃＃カウンター＃＃＃
• (マスターはlogicComponentとCounterの親です)
ロジック コンポーネントは数値をマスター コンポーネントに渡し、マスター コンポーネントはその数値をアニメーションを実行するカウンター コンポーネントに渡します。 論理コンポーネントは数値を段階的に送信します。つまり、何かが発生するたびに更新を送信します。

たとえば、logicCounter はカウンタをインクリメントするために Master を 10 回呼び出します。Counter は 10 回レンダリングして 10 個の数字を表示すると予想します。 これまでに試したことはすべて、最終的な数値 (10) を増分なしで表示します。

ソリューションを検索した結果、

を見つけ、それを React に実装する適切な方法を探していました。

サードパーティの npms/ライブラリの使用を避けようとしています。 あなたの助け/アイデアをお待ちしています。 ありがとう。