React Hook :: useEffect의 역할 살펴보기

 

h1요소를 클릭시, 

콘솔에 say hello 뜨게 만들기.

 

  componentDidMount 역할  

  (렌더링된 직후 호출)  

 

component가 mount 되었을 때, onClick 이벤트 추가.

 

 

  componentDidUpdate 역할  

  (props나 state가 변했을때 새롭게 갱신되면서 렌더링 후 호출)  

 

useEffect(effect, deps);

두번째 요소가 [] 빈칸, 즉 없으므로 변화가 일어나도 다시 실행되지 않음.

 

 

  componentWillUnmount 역할  

  (컴포넌트가 DOM 상에서 제거될때 호출)  

 

return 을 사용.

useEffect는 onClick 이베트 제거를 반환함.

이렇게 사용하면 useEffect로 정리할 수 있음.