Name | Type | Required | Default | Description |
---|---|---|---|---|
disabled | boolean | false | ||
max | number | false | 100 | The maximum value of the slider (right side) |
min | number | false | 0 | The minimum value of the slider (left side) |
showLabel | boolean | false | Whether or not to show value labels below the slider increments. | |
step | number | false | 1 | The distance between each stopping point on the Slider. |
value | number | false | (max < min) ? min : min + (max - min)/2; | The currently set value of the Slider. Defaults to the middle between min and max. |
You can provide a default value to the Slider using value.
If you don't provide a default value to the Slider, the default will be calculated by the formula min + (max - min) / 2.
The Slider component will take a in a minimum value, a maximum value, and an optional distance between each stopping point or "increment" on the Slider.
For example, you can have a min of 10, a max of 60, and step of 10. Which would give you values of 10, 20, 30, 40, 50, 60 on your Slider.
You can add labels underneath the increments by using the showLabel prop.
You can add a disabled state with the disabled prop.
Whether or not to put the slider into a disabled state.
10.19.0