Toggle
Info! Die Beschriftung eines Switches sollte immer die Funktion beschreiben, die der Switch ein- und ausschaltet,
niemals die damit verbundene Aktion oder einen möglichen Zustand (Bsp. „Bluetooth“ statt „Bluetooth ein“).
Info! Diese Komponente kann auch ohne Label verwendet werden, wenn der Kontext durch die Position oder
ein externes Label klar wird.
Eigenschaften
| Name | Type | Default Value | Description |
|---|---|---|---|
id | string | undefined | Unique ID, unique id will be generated if not set. |
disabled | boolean | false | Disables the Radiobutton |
checked | boolean | undefined | Weather the switch is toggled or not |
leftLabel | string | undefined | Label left of the element |
rightLabel | string | undefined | Label right of the element |
title | string | undefined | Appears on hover |
isLoading | undefined | false | |
style | string | undefined | Additional css styles |
tabindex | number | 0 | Index of sequential keyboard navigation |
Events
| Name | Description |
|---|---|
change | fires on toggle changed by user |
Beispiele
Default
Left Label
Right Label
Left & Right Label
Disabled
Loading
Do's and Don'ts
Do
Don't
Switch mit eindeutiger Beschriftung zur entsprechenden Funktion
Switch wird nicht für eine Auswahl verwendet