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

I think previous answers fix your problem. However, I'd say the solution doesn't need to involve React states.

The only reason behind your frozen input slider is that you've hardcoded its value to 3, as @Colin Whitmarsh suggests.

Simply, this works:

Now, you probably need its output to do something. You can use onChange={this.handleChange} as @xCrZx states in his answer. But inside handleChange you don't necessarily have to update your state. Depending on your logic, you could avoid increasing the complexity of your state and simply code your logic inside handleChange.

If you avoid updating the state, you'll probably save some renders and your performance will improve.