useEffect, useMemo

cw k·2021년 9월 3일
0

react

목록 보기
1/1
post-thumbnail

useEffect

컴포넌트가 마운트 됐을 때 (처음 나타났을 때), 언마운트 됐을 때 (사라질 때), 그리고 업데이트 될 때 (특정 props가 바뀔 때) 특정 작업을 처리

첫번째 파라미터로 함수, 두번째 파라미터로 배열(deps)을 전달한다.

  1. 두번째 파라미터가 비어있을때
    -> 컴포넌트가 처음 마운트, 마지막 언마운트 될때만 호출된다.
  2. 두번째 파라미터에 값을 넣었을때
    -> 1번 + 값이 바뀔때도 호출된다. useEffect 안에서 사용하는 상태나, props 가 있다면, useEffect 의 deps 에 넣어주어야 합니다. 그렇게 하는게, 규칙입니다.
  3. 두번째 파라미터를 생략했을때
    -> 컴포넌트가 리렌더링 될때마다 호출.

    참고로 리액트 컴포넌트는 기본적으로 부모컴포넌트가 리렌더링되면 자식 컴포넌트 또한 리렌더링이 됩니다.

useMemo

memo = memoized

주로 성능 최적화를 위해 사용.

첫번째 파라미터로 함수, 두번째 파라미터로 배열(deps)를 넣는다.

deps에 들어간 값이 바뀔 경우에만 첫번째 파라미터로 지정한 함수를 호출한다.
값이 바뀌지 않았을땐 이전에 연산한 값을 재사용한다.

출처
https://react.vlpt.us/

0개의 댓글