<dy-switch>
A switch component that allows users to toggle between two states. It provides visual feedback and can be customized with different colors based on semantic meanings.
Example
Loading...
<dy-switch
.neutral=${"informative"}
.checked=${true}
@change=${(evt) => evt.target.checked = evt.detail}> WIFI </dy-switch> <dy-switch
.neutral=${"informative"}
.checked=${true}
.disabled=${true}> Data Saving Mode </dy-switch>
API
DuoyunSwitchElement
Extends TapSwitchElement
TapSwitchElement
Shadow DOM; Extends GemElement
TapSwitchElement Instance Properties
| Property(Attribute) | Reactive | Type |
|---|---|---|
disabled(disabled) |
Yes | boolean |
checked(checked) |
Yes | boolean |
value(value) |
Yes | string |
neutral(neutral) |
Yes | 'positive' | 'negative' | 'neutral' | 'informative' |
change |
Emitter<boolean> |
TapSwitchElement Other
| Type | Value |
|---|---|
| Event | change |
| Slot | unnamed |