JSX React HTML5 Input Slider Doesn't Work

Question

I\'m using React.JS for a build, and am building a range input slider with two choices for a component.

this is my code:

Answer 1

Try this:

onInput() {
    var input = document.getElementById("typeinp");
    var currentVal = input.value;
    this.setState({
      value: currentVal
    })
}

I suggest changing value="3" to defaultValue="3", otherwise I think value is hardcoded to "3" and may be difficult or impossible to change. The onInput function finds the value and adds it to state so the data can be passed to another component or function. There's likely a more elegant solution to your problem, but the above should work.