今日やったこと

• 「モダンJavaScriptの基本から始める React実践の教科書」 P175〜183
  • 7-1 グローバルなState管理が必要な理由

学習メモ

• グローバルなState管理の仕組みを用いることで、コンポーネント間でPropsを受け渡すことなく値の共有をすることが可能になる
• 下層のコンポーネントで使いたいがために不要なPropsを受け渡していくことをバケツリレーと表現する
• デメリット
  • 本来必要のないPropsを受け取っていることで他の場所で再利用できないコンポーネントになってしまう
  • 再レンダリングが必要ないにもかかわらずState更新時に全て再レンダリングしてしまう

バケツリレーの例として、管理者のみ「編集」ボタンを押せるようなケースを想定したアプリを作成

このアプリでは、App.jsに管理者フラグのStateを持っていて、最下層であるEditButton.jsxまで渡している
Card.jsxはバケツリレーするためだけにisAdminというPropsを受け取っていることになる

所感

useStateの使い方を忘れていました。実際に書き続けないとすぐ忘れてしまいますね。
次回はバケツリレーの解決法について学びます。