Toggle
View on GitHub: Copmonent
View on GitHub設定をオンまたはオフに切り替えるためのコンポーネント
Example#
Props#
| Name | Type | Default | Description |
|---|---|---|---|
| checked optional | boolean | - | 現在の状態が選択中かどうか |
| onChange optional | ChangeEventHandler<HTMLInputElement> | - | 値が変化した場合のコールバック |
| disabled | boolean | false | 無効状態かどうか |
| data-* optional | string | - | Custom data attributes |
Feature#
- 設定項目が2つの状態のみを持つ場合（例えば、設定の有効/無効）に適しています。
- ユーザーが行った選択をすぐに反映させるシナリオに適しており、直感的に操作できるように設計されています。
Usage#
checkedとonChangeを使用して値をコントロールして使用してください。onChangeで通信を伴うなど待機時間が生まれる場合には、楽観的に状態を更新することが好まれます。