function App() {
const [useEffectRender, setUseEffectRender] = useState(true);
return (
<div className="App">
{useEffectRender && <UseEffectExample />}
<button onClick={() => {setUseEffectRender(!useEffectRender)}}>언마운트 시키기</button>
</div>
);
}
export default App;
버튼을 누르고 useEffectRender값이 true / false를 반복하면서 컴포넌트가 마운트, 언마운트 되도록 동작하게 하는 코드... useEffect return에 적어준 언마운트시 실행되어야하는 로직들이 제대로 실행되는지 확인해볼 수 있다.