1.1.2 • Published 5 years ago
rc-ruler-slider v1.1.2
rc-ruler-slider
Slider component for React
Install
npm install rc-ruler-slider --save
Usage
import Ruler from 'rc-ruler-slider/dist';
import 'rc-ruler-slider/dist/index.css';
handleDragChange = (value) => {
console.log(value);
}
handleDragEnd = (value) => {
console.log(value);
}
handleDragStart = (value) => {
console.log(value);
}
handleRenderValue = (value) => {
return `${value}%`;
}
<Ruler
startValue={50}
onDrag={this.handleDragChange}
onDragEnd={this.handleDragEnd}
onDragStart={this.handleDragStart}
renderValue={this.handleRenderValue)
start={0}
end={90}
step={1}
/>
Proptypes
propTypes: {
// start current ruler value
startValue: PropTypes.number,
// start ruler value
start: PropTypes.number,
// end value
end: PropTypes.number,
// step of drag
step: PropTypes.number,
// handle drag function
onDrag: PropTypes.func,
// handle drag end function
onDragEnd: PropTypes.func,
// handle drag start function
onDragStart: PropTypes.func,
// handle custom render value in ruler pointer
onRenderValue: PropTypes.func,
// class of component
className: PropTypes.string,
}