React+TypeScript: 在庫管理 トータル付き

はじめに

前々回の買い物リストのtotalの状態管理はuseEffectを使いました。

今回、useStateだけでどうにかならないかと工夫して、データのそれぞれに全体のトータル(同じもの)を入れてみました。一応目的通りには動いている。

状態管理に階層がある場合、どうするのが正解なのか知りたい。

実行例

See the Pen Untitled by kalz2q (@kalz2q) on CodePen.

あとがき

在庫管理としては数量を減らす機能がないので、使い物になりませんが、プログラムとしては色んな点で綺麗に書けていると思う。自画自賛

元記事: ドットインストール React入門

のプログラムは跡形もないのですが、アウトプットはそのままなので書いておきます。