React-js-multi-range-sliders NPM

Installation

To install this module cd to your project directory and enter the following command:

npm i react-js-multi-range-sliders --save

yarn add react-js-multi-range-sliders

Usage

The following code presents the basic usage scenario of this library:

import MultiRangeSlider from "react-js-multi-range-sliders";

const App = () => {
  return (
    <MultiRangeSlider
      min={0}
      max={100}
      onChange={({ min, max }) => console.log(`min = ${min}, max = ${max}`)}
    />
  );
};

export default App;

Check out the example project for more examples.

Properties

Property	Description	Type	Required
`max`	Initial maximum value of the slider.Default value is 1.	number	yes
`min`	Initial minimum value of the slider.Default value is 0.	number	yes
`onChange`	Callback continuously called while the user is dragging the slider.	function	yes
`className`	This property used to override the container class Default class is container	string	No
`title`	This property used to add the slider title	string	No

Browser support

Chrome (latest, mac, windows, iOS, Android)
Firefox (latest, mac, windows)
Safari (latest, mac, iOS)
Edge (latest, windows)

Contributing

This is how you can spin up the dev environment:

git clone https://github.com/ankushchavaninfo/react-js-multi-range-slider.git
cd react-js-multi-range-slider

Made with ❤️ 🙏

react-js-multi-range-slider is an open source project and will always remain free to use. If you think it's cool, please star it. if you need any help with these or just want to say hi!.