Switch
On/off toggle. Use for binary settings where the result is immediate (no Save button needed).
Default
Bound with v-model.
With label
Pair with a Label for click targets.
Disabled
Disable input.
API Reference
Props, events, and slots for each sub-component.
Switch
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| modelValue | boolean | false | Checked state. Supports v-model. |
| defaultValue | boolean | false | Initial state when v-model is not used. |
| disabled | boolean | false | Disable input. |
| id | string | — | Match with a Label for prop. |
Events
| Event | Description |
|---|---|
| update:modelValue | Fires with the new checked state. Enables v-model. |
Slots
| Slot | Description |
|---|---|
| thumb | Override the sliding thumb content (e.g. an icon). |
Accessibility
Keyboard shortcuts and ARIA behavior.
Keyboard
| Shortcut | Description |
|---|---|
| Space | Toggles the switch when focused. |
| Enter | Toggles the switch when focused. |
| Tab | Moves focus to or from the switch. |
- Uses role=switch with aria-checked reflecting the on/off state.
- Pair with a label so the control's purpose is announced.