Ant Design Blazor
Switch
Switching Selector.
When To Use
- If you need to represent the switching between two states or on-off state.
- The difference between
SwitchandCheckboxis that Switch will trigger a state change directly when you toggle it, while Checkbox is generally used for state marking, which should work in conjunction with submit operation.
Examples
The most basic usage.
With text and icon.
Mark a pending state of switch.
Switch API#
| Property | Description | Type | Default Value |
|---|---|---|---|
| Loading | ParameterWhether switch is loading or not. Will display spinner on handle when true. | Boolean | false |
| CheckedChildren | ParameterString displayed inside switch when checked is true | String | -- |
| CheckedChildrenTemplate | ParameterContent displayed inside switch when checked is true. Takes priority over AntDesign.Switch.CheckedChildren. |
RenderFragment | -- |
| Control | ParameterWhen true, the status of Switch no longer automatically changes the data based on the click event. | Boolean | false |
| OnClick | ParameterCallback executed when the switch is clicked. When used in combination with AntDesign.Switch.Control it allows manually controlling the Switch. |
EventCallback | -- |
| UnCheckedChildren | ParameterString displayed inside switch when checked is false. | String | -- |
| UnCheckedChildrenTemplate | ParameterContent displayed inside switch when checked is false. Takes priority over AntDesign.Switch.UnCheckedChildren. |
RenderFragment | -- |
| AutoFocus | ParameterWhether to autofocus on the input or not | Boolean | false |
| Checked | ParameterIf the input is checked or not | Boolean | false |
| OnChange | ParameterCallback executed when the input changes | EventCallback<Boolean> | -- |
| CheckedChanged | ParameterGets or sets a callback that updates the bound checked value. | EventCallback<Boolean> | -- |
| Disabled | ParameterDisable the input | Boolean | false |
| ValidationMessages | Validation messages for the FormItem | String[] | -- |
| AdditionalAttributes | ParameterGets or sets a collection of additional attributes that will be applied to the created element. | IReadOnlyDictionary<String, Object> | -- |
| Value | ParameterGets or sets the value of the input. This should be used with two-way binding. | Boolean | -- |
| ValueChanged | ParameterCallback that updates the bound value. | EventCallback<Boolean> | -- |
| ValueExpression | ParameterAn expression that identifies the bound value. | Expression<Func<Boolean>> | -- |
| ValuesExpression | ParameterAn expression that identifies the enumerable of bound values. | Expression<Func<IEnumerable<Boolean>>> | -- |
| Size | ParameterThe size of the input box. Note: in the context of a form, `InputSize.Large` is used. Available: `InputSize.Large` `InputSize.Default` `InputSize.Small` | InputSize | InputSize.Default |
| CultureInfo | ParameterWhat Culture will be used when converting string to value and value to string Useful for InputNumber component. | CultureInfo | CultureInfo.CurrentCulture |
| Id | ParameterID for the component's HTML | String | Uniquely Generated ID |
| Class | ParameterSpecifies one or more class names for an DOM element. | String | -- |
| Style | ParameterSpecifies an inline style for a DOM element. | String | -- |
| RefBack | ParameterA ForwardRef instance. You can get a reference to the internal DOM by using AntDesign.ForwardRef.Current. |
ForwardRef | -- |