カテゴリー：Redux
-
【Redux】「正規化」について
09.11
例えば、以下のようなデータがあるとしましょう。 [crayon-6179438a28792566997334/] 以下のデータが複数回繰り返し出てきているので正規化されていないデータと言えます。 [crayon-6179438a287…
-
【React/Redux】良い構成
09.10
共通関数 共通View向けの関数(stateのfilterなど） コンポーネントに直接記述するのではなく、以下の理由でRedux Tool KitのSliceの中に記述することが望ましいです。 各ビューで使いまわせるため。 これはそ…
-
【React】APIへの非同期処理の書き方総論
07.25
Hooksでstate管理する場合 useEffectか、onClickのハンドラの中に非同期処理を置くのが普通です。 Reduxでstate管理する場合 redux-thunkだとaction-creatorが大きくなるので、少し複…
-
【Redux】イミュータブルとは？
07.24
Reduxにおけるイミュータブルとは？ オブジェクトの状態が変わらないことです。 Reduxはミュータブルに直接値を更新してはいけないと言われています。 つまり、値を更新する際は、必ず新しいオブジェクトを生成して返しなさいとい…
-
【Redux】「Reducer」の分割単位
07.24
Reduxの分割単位 レンダリングツリーごとの分割 画面ごとに分割をすること。 [crayon-6179438a29115595584486/] ドメインデータごとの分割 商売、ログインなどの業務ごとに分割すること。 [cray…
-
【Redux】仕組み
07.24
stateで保持している状態を渡す。 Reduxストアの状態を渡すためにコンテキストを使うのではなく、更新のチェックをするためにReduxストアへのサブスクリプションのためにコンテキストを使用する。 常に同じコンテキスト値を…
-
今はHooksが使える時代なのであまりこの考え方はしないようになってきていますが、過去の案件のソースとかを読む場合に知っておくと良い概念かと思いましたので、まとめておきます。 Reduxを使うにあたってどのようにコンポーネントを分ける…
-
【Redux】新しいStoreとの接続方法
07.22
2019年にReact Hooksが登場して、Reduxもv7.1.0になりReact Hooksに対応したReduxのStoreに接続する方法が増えました。 従来の書き方 connect関数を使う。 新しい書き方 useSelec…
-
redux-actions redux-actionsというライブラリを使うことで下記のように簡潔に記述できるようになり実務ではこちらの書き方が使われていたりします。 Actions側 createActionsでAction-Cre…
-
各コンポーネントからuseDispatchなどでRedux Tool Kit内のReducer関数を呼び出したり、useSelectorでstateを参照したりすると思いますが、RTK独自の構文になるのでRenderでそのまま呼び出そうとし…