useContext + useReducer の使いどころ - パンダのプログラミングブログ

パンダとおくだが、Web業界の当たり前を「これって本当にそうだっけ？」と問い直すラジオを配信しています TR;DR useContext は、階層の深いコンポーネントに state を渡す場面で使うと良い useReducer は、state の変更パターンが多い場面で使うと良い useContext + useReducer は、state を使うコンポーネントの階層が深い上に、前回の state を元に新しい状態を作る場面で使うと良い useContextだけを使うケース useContext は React の組み込みの Hooks の1つです。Provider でラップしたコンポーネントのツリーのどこからでも、同一の Context Object を参照できるようにする Hook です。 useContext は Context を通じて子や孫以下のコンポーネントで同一の JS オ

[carolina04]

前回の状態に依存した更新処理をする場合には useState の代わりに useReducer を利用することで、より簡潔に記述することができる export const SearchConditionContext = createContext<State | Action>(initialState)