React Strict Mode forces useEffects to double render. The problem is that this causes the cleanup code to run on page enter AND exit. Instead of just on exit like the cleanup should do.
useEffect(() => {
return () => {
console.log('do you only call once?')
// TODO: Fix why this is resetting to init state when I ENTER instead of just leave
// dispatch(resetToInitialState())
}
}, [])
The above code will trigger once when entering the page, another time when exiting. The issue is that I’d set states before navigating in the page, and the React Strict mode would mean the cleanup resets everything to initial state…
Is there anyway to prevent cleanup from being called on page enter without disabling React Strict mode? Note that I fixed it by disabling React Strict mode, but wanted to keep it on if possible.
1