리액트 훅

useState

useEffect

useRef

• state와 비슷하게 값을 저장하지만, 값이 바뀔 때 리렌더링이 일어나지 않는다.
  • 따라서 값이 바뀌어도 리렌더링이 일어나지 않는 변수를 사용하고 싶을 때 유용하다.
  • state가 UI에 보이는 값에 사용된다면, ref는 보이지 않는 값에 주로 사용된다.
  • 리렌더링이 되더라도 ref의 값은 초기화되지 않는다.
• DOM 객체를 가리킬 때 사용된다.
  • input 요소를 클릭하지 않아도 포커스를 주고 싶을 때 사용한다.

사용법

① import { useRef } from ‘react’;

② const countRef = useRef(0);

(주로 작명은 state와의 구분을 위해서 ~~Ref로 작명한다. 괄호 안에 있는 값이 초기값이 된다.)

③ 값을 사용할 때는 current를 붙이면 된다. 예를 들어 countRef.current 이렇게. 이 값은 수정이 가능하다.

useContext