useEffect

LEE JI YOUNG·2022년 2월 28일
0

React

목록 보기
15/19

https://bgeun2.tistory.com/30

  • 화면이 처음 떴을때 실행.
    deps에 [] 빈배열을 넣을 떄.
    life cycle중 componentDidmount처럼 실행
  • 화면이 사라질때 실행(clean up함수).
    componentWillUnmount처럼 실행
  • deps에 넣은 파라미터값이 업데이트 됬을때 실행.
    componentDidUpdate처럼 실행.

useEffect가 어려우면 한없이 어려워지는 부분이라 더 어려우실수도 있을꺼 같네요
useEffect는 첫 문장에 나와있듯이
이번에는 useEffect 라는 Hook 을 사용하여 컴포넌트가 마운트 됐을 때 (처음 나타났을 때), 언마운트 됐을 때 (사라질 때), 그리고 업데이트 될 때 (특정 props가 바뀔 때) 특정 작업을 처리하는 방법에 대해서 알아보겠습니다

화면이 처음 떴을때 실행.
deps에 [] 빈배열을 넣을 떄.
life cycle중 componentDidmount처럼 실행
화면이 사라질때 실행(clean up함수).
componentWillUnmount처럼 실행
deps에 넣은 파라미터값이 업데이트 됬을때 실행.
componentDidUpdate처럼 실행.
이렇게 이해하시면 되구요. 혹시 이해가 안되신다면 클래스형 컴포넌트와 리액트 라이프사이클을 보고오시면 다시 설명을 보시면 이해가 되실꺼 같습니다.

그리고 저는 개인적으로 어느정도 이해가 됬을때
https://rinae.dev/posts/a-complete-guide-to-useeffect-ko
이 글을 읽고 더 이해가 잘 됬습니다. useEffect는 동기화라는 말이 참 와닿더라구요

ps. 혹시 제 글에 잘못된 점이 있거나 하면 알려주세요!

profile
프론트엔드 개발자

0개의 댓글