Slider
Display the current value and an inputable range.
General
Accept clicks or drag actions.
Type
Differentiate states by color.
Disabled
Do not respond to drag and click.
Step
Different granularity.
Range
Specifies the maximum or minimum value of the Slider.
Event
Get event when slide.
APIs
Slider.Props
| Attribute | Description | Type | Accepted values | Default |
|---|---|---|---|---|
| initialValue | initial value | number | - | 0 |
| value | slider value | number | - | 0 |
| type | current type | SliderTypes | SliderTypes | default |
| step | the granularity the slider can step through values | number | - | 1 |
| max | the maximum value of slider | number | - | 100 |
| min | the minimum value of slider | number | - | 0 |
| disabled | disable slider interaction | boolean | false | |
| showMarkers | show each marker | boolean | - | false |
| hideValue | hide slider value | boolean | - | false |
| onChange | called when the value of silder changes | (val: number) => void | - | - |
| ... | native props | HTMLAttributes | 'id', 'name', 'className', ... | - |
SliderTypes
type SliderTypes =
| 'default'
| 'primary'
| 'secondary'
| 'success'
| 'warning'
| 'error'
| 'info'
Previous
Rating
Next
Slider
MADE & DESIGNED WITHBY BRUNO ANDRADE
