useEffectcleanup


docs
useEffect(() => {
// setup code
return () => {
// cleanup code
};
}, [...]);



docsuseEffectComponent
setup code
connect
cleanup code
disconnect
setup code




cleanup code
propsstate clenup code
proptstate setup code
Componentunmount


cleanup ref
useEffect(() => {
const node = ref.current;
node.style.opacity = 1; // Trigger the animation
return () => {
node.style.opacity = 0; // Reset to the initial value
};
}, []);
fetch
cleanupfetch

eventlisten ref
useEffect(() => {
function handleScroll(e) {
console.log(window.scrollX, window.scrollY);
}
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);
remove







useEffectcleanup
mrsekut
>effectsubscribecleanupcleanupref
mrsekutmrsekut


reactui libraryuseEffectUI
cleanUp
fetch
ui library
custom hook使hooksReactfetch

docscleanup
>
>MapWidget DOM
>React Map DOM MapWidget JavaScript ref

>3. ref
>