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.