developergovindgupta / multi-range-slider-react-ts

single component to select range value from slider with no other dependency.
14 stars 9 forks source link

Infinite loop with onInput #9

Open mahdix opened 4 weeks ago

mahdix commented 4 weeks ago

I'm using latest version (2.0.7). Looks like if I change a non-trivial state inside onInput handler, it causes infinite calls to the handler:

image

I simply modified the original codesandbox: url

Basically, my change is like:

  onInput={(e) => {
          setV({ ...v, min: e.minValue, max: e.maxValue });
          console.log("onInput called");
        }}

and it causes the loop;

If I use two separate state variables, everything works fine.

setMin(e.minValue);
setMax(e.maxValue);
ullaskunder1 commented 2 days ago

I created a separate component and using that i have two slider component it is now re-rendering creating infinite loop