【React】Props のバケツリレー解消法についてはじめに Reactでは、コンポーネント間のデータの受け渡しにおいて、propsのバケツリレーの問題がよく発生することがあります。 バケツリレーとは、あるコンポーネントから別のコンポーネントに props を渡す際に、複数の中間コンポーネントを経由して渡しているだけの状態をいいます。 なぜこのような問題が発生するかというと、React では「単方向データフロー」を採用していて、コンポーネント間で直接データをやり取りすることができないためだからです。 Context API や状態管理ライブラリで解消する方法もありますが、props を渡すだけの分かりやすいコンポーネントを作成することも重要になってきます。 そこで今回は、不要なコンポーネント層を削除する方法や、コンポジションパターンを用いた解決策について紹介していきたいと思います。 バケツリレーとその問題点 バケツリレーとは? React
