• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

렌더링과 mount/unmount

21.04.01 09:03 작성 조회수 189

0

const RSP = () => {
  useEffect(() => {
    console.log('다시 실행');
    interval.current = setInterval(changeHand, 100);

    return () => {
      console.log('종료');
      clearInterval(interval.current);
    }
  }, [imgCoord]);
  return ( 
    ...
  );
}

useEffect가 받는 effect 함수가 리턴하는 함수가 componentWillUnmount 역할을 하는 함수라고 하셨는데요. 그리고 setInterval 안에서 changeHand에 의해서 imgCoord가 바뀌면서 useEffect가 받는 effect 함수가 계속 실행되는 것을 보게 되는데, 그럼 여기서 렌더링 과정이라는 게 컴포넌트를 unmount 했다가 새로 mount하는 과정이라고 봐도 괜찮은 것인가요? state가 바뀔 때 컴포넌트 함수 전체가 다시 실행된다는 얘기도 하셨던 것 같은데, 그럼 이 과정도 unmount하고 다시 mount하는 과정인 것인가요? 렌더링과 mount/unmount 과정의 관계? 차이?가 궁금합니다. 

답변 1

답변을 작성해보세요.

0

deps가 []일때만 willUnmount와 같고요.

deps에 요소가 존재하면 deps의 변경으로 useEffect가 새로 시작하기 전에 실행됩니다.