Not able to update state variable on onChanged callback , gives error 'unstable_flushDiscreteUpdates: Cannot flush updates when React is already rendering'

[jinojacob15]

const handleAfterChange = event => {
const { index } = event.item;
setActiveSlideIndex(itemCount);
};

const customSettings = {
autoplay: false,
dots: true,
callbacks: true,
onChange: event => handleAfterChange(event)
};

Above code produces error !

[timsewellatom]

I've been battling the same problem and using React.memo to wrap the OwlCarousel component seems to have fixed it.