컴포넌트 언마운트 시키기

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에 적어준 언마운트시 실행되어야하는 로직들이 제대로 실행되는지 확인해볼 수 있다.