multiRangeSlider
!
blue!
redInstallation
``
shell
npm i @saidaitdriss/multirangeslider
`
usage
$3
`
javascript
import MultiRangeSlider from "@saidaitdriss/multirangeslider";
`
$3
`
javascript
min={0}
max={100}
onChange={(min, max) => {
console.log("min : ",min)
console.log("max : ",max)
}}
leftValue={29}
rightValue={100}
currency={"€"}
/>
``
min : the minimum value of the range
max : the maximum value of the range
onChange : method to execute when the value of min or max changed
leftValue : the left value of the range
rightValue : the right value of the range
currency : the symbol of the price
Other options
|Name|description|default|
|----|-----|-------|
|containerStyle|the style of the container|{ display: "flex", alignItems: "center", justifyContent: "center", paddingBottom: "14px", paddingTop: "14px", width: "300px", }|
|rangeStyle| the style of the range| { backgroundColor: "red" }|
|valuesStyle|the style of left and right values | { color: "red", fontSize: "12px" }|