How to synchronize input and range slider?

Question

React

I want that by moving the range slider the value of the input changes, and by entering another number in the input the slider slider moves to the entered value. Here is the second and it is impossible to implement. value in the input is simply not even entered otherwise. How to fix this matter?
https://codesandbox.io/s/xenodochial-dawn-9sien?fi...
Thanks.

Answer 1

setValue(value === e.target.value);

Extra: value ===.
Well, there are not enough restrictions, so:

setValue(Math.min(max, Math.max(min, e.target.value)));

UPD. Taken from the comments:

I wanted to implement the same thing with a double range slider and it turned out to be somewhat more complicated.

Nothing complicated .