RadioまずはRadioコンポーネントを使う準備をします。上でならRadioProps型も取り込むと便利かもしれません。/>と置くだけでも以下の画像のように動きます。(分かりやすいようにチェックを入れたものを横に置いてます。)カスタマイズいくつか設定可能なプロパティがあります。checked上記画像のようなチェック状態にしたい場合はchecked(boolean)を設定することで上記画像の右側のような状態にできます。onChange状態が変わった時に呼び出されるハンドラーです。void;というような型の関数を渡します。}}/>;value<input>要素のvalueとなる値を渡します。これを設定することでchangeEventからvalueを取得することができます。value="foo"/>;name<input>要素のnameとなる値を渡します。グループを形成する為に使います。/>;inputProps「RadioPropsで用意されていないけど<input>要素に渡したい」属性はここに渡します。場合型エラーになります。割り当てることはできません。useStylesにより生成されたclassesオブジェクトを渡します。mediumの中から指定できます。デフォルトはmediumです。'default'の中から指定できます。デフォルトは'secondary'です。'primary'はチェック時に青色、'default'は灰色で塗りつぶされます。ボタンのビジュアルは<svg>要素なのでCSSで弄る事が難しいです。このプロパティにReact.ReactNodeを渡すことで<svg>要素が置かれている箇所を好きな要素に置き換えることができます。checkedIconiconと同じく<svg>要素を置き換えることが目的ですが、こちらはチェック済みの状態のReact.ReactNodeを渡します。/></>;以下の画像のように表示されます。RadioGroup以下でインポートして使います。'@material-ui/core/RadioGroup';この要素で囲む理由の1つはチェックされる要素を1つにする為です。チェック済みにすることができます。1つの理由はキーボード操作をし易くする為です。→キーでチェックしたい項目を切り替えることができます。