리액트의 훅 useEffect

eggMun·2023년 2월 5일
0

useEffect란?

클래스형 컴포넌트에는 componentDidMout와 같은 생명주기 메서드들이 있다!!
함수형 컴포넌트에는 무슨 생명주기 훅이 있을까??
그건 바로 useEffect 훅이다!

componentDidMount

useEffect(() => {
 	console.log("렌더링 이후 실행하면서 딱한번만 실행!") 
}, [])

여기서 []은 의존성 배열이다!
의존성 배열(dependency-array)에 값을 넣으면 그 값이 변화할 때마다 실행이 된다!

componentDidUpdate와 비슷

 useEffect(() => {
    console.log("변경되고 나서 실행!!");
  });

componentDidUpdate와 다른 점은 Mount 됐을 때 한번 실행이 된다!

componentWillUnmount

 useEffect(() => {
    console.log("그려지고 나서 실행");
    return () => {
      console.log("사라지기 전에 실행");
    };
  });
profile
블로그 이전: https://medium.com/@eggmun98

0개의 댓글