발생 이유 : router 이동 한 후 이전 컴포넌트에서 state 값을 바꾸려고 할 때 발생하게 된다.

• 기본적으로 useState는 비동기적으로 동작하기 때문이다.

const moved = () => {
        if(window.scrollY > 50)
            setShow(true);
        else
            setShow(false);
    }

useEffect(()=> {
        window.addEventListener("scroll", moved)
    }, [])

이 기능은 Navbar가 스크롤 이동을 감지해서 Navbar에 다른 css 값을 적용하는 동작을 하고 있는데 이 함수가 동작하는 도중 Rotuer로 이동해서 발생하게 됐다.

해결 방법이 두 가지가 있다

1. 라우터 이동하기 전에 오류를 발생시키는 함수에서 state 변경을 완료하고 이동한다
2. 에러 메시지에 있는 조언대로 useEffect cleanup function을 쓰면 된다.

useEffect cleanup function이 뭔가 했더니 useEffect를 썼을 때 종료할 때 실행되며 " 상태의 종료를 반환함수에 정의 "하는 것이었습니다

• 정리

cleanup 함수는 컴포넌트가 화면에서 사라질 때(unmount) 수행된다고 이해할 수 있고

cleanup 함수는 컴포넌트 제거 전 setInterval, setTimeout 등의 작업들을 clear해야 할 때, 라이브러리 인스턴스를 제거해야 할 때 유용하게 사용된다고 합니다