Event HandlerとuseStateについて紹介していきます。ユーザーがボタンを押下する、何か画面に入力するなどの操作をトリガーとして、定義したイベントを実行する仕組みになります。useStateと組み合わせて使うことがあるため、一緒に紹介します。 本記事では、前回記事で使ったコードを元に変更・追加をしていきます。 条件分岐によるcomponent表示切り替え方法だけであれば、本記事内のコードだけで理解できるようにしています。 2.条件分岐による切り替え「Add New」ボタンのクリックにより、表示内容を切り替え、「Cancel」ボタンによって元の表示にする例を紹介します。 条件分岐による切り替え方法は、いくつかあります。 2.1 && を使うNewExpense.js import React, { useState } from 'react'; import ExpenseF
![React 条件分岐によるComponent表示切り替え方法を理解する #4 - Masa engineer blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f3cb23755e6ca289c9c26d14620cf0f23e250ba/height=288;version=1;width=512/https%3A%2F%2Fmasa-engineer-blog.com%2Fwp-content%2Fuploads%2F2022%2F07%2FReactjs-conditional-content-thumbnail.jpg)