Begrip: useEffectEvent

De useEffectEvent hook die gebruikt kan worden om de logica van een useEffect hook af te zonderen van de useEffect zelf.

Op deze manier wordt de dependency array van een useEffect hook kleiner en wordt de hook enkel uitgevoerd als dit absoluut noodzakelijk is. De useEffectEvent hook heeft altijd toegang tot de up-to-date waarden van de variabelen en heeft nooit problemen met stale data.

const Foo: FunctionComponent = () => {
    
    const event = useEffectEvent(() => {
        // Event code
    })
    
    useEffect(() => {
        // Effect code
        
        return () => {
            // Cleanup code
        }
    }, [variablenDieHetEffectMoetenTriggeren])
    
    return <>...</>
}