Example of usage input-range-marks.
class Demo extends Component {
onChange=(val)=>{
console.log('input range value - ', val )
}
render() {
return <div>
<h1>input-range-marks Demo</h1>
<InputRange
width={350} //width of input element
onChange={this.onChange} //callback
inputRangeAttrs={{default:2, min:1, max:5, step:1}} //base attributes of input type="range"
disabled={false}
marks={[ //array of marks & labels; length of the array must be equal to the number of steps
{mark: '⏶', label: 'highly unlikely'},
{mark: '⇧', label: ''},
{mark: 3, label: 'maybe yes maybe no'},
{mark: '|', label: 'probably'},
{mark: '✓', label: 'highly likely'}
]}
fontsize='1em' //font size of marks & labels
/>
</div>
}
}