일단 하다보면 되겠지 ^v^ 자세히보기

useEffect 2

[React] React Hook - useRef

useRef 사용하기 const ref = useRef(value); ref 의 초기값은 useRef에 선언하며, ref 는 {current: value} 의 형태로 저장된다. 해당 객체는 수정이 가능하기 때문에 언제든 바꿔줄 수 있다! 그리고 컴포넌트가 unmount 되기 전까지는 값을 유지한다. useRef는 변경 가능한 객체를 반환한다. 반환된 객체는 useRef의 인자를 current 라는 속성에 저장한다. 반환 객체는 컴포넌트가 unmount 될 때 까지 지속된다. useRef 는 Ref 가 변해도 re-render 되지 않으며, re-render 되어도 Ref는 유지된다. 값이 아무리 바뀐다고 해도 렌더링이 일어나지 않기 때문에 성능적인 부분에서 유리하다. 사용 예시 1. 저장공간 state ..

React 2022.07.25

[React] React Hook - useEffect

Hook은 React 16.8 버전부터 새로운 요소로 추가되었다. 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있게 된것! useEffect 훅이란? 리액트 컴포넌트가 렌더링 될 때 마다 특정 작업을 실행할 수 있게 하는 Hook이다. useEffect를 사용하게 되면 함수형 컴포넌트에서 부가기능(side effect) 를 사용할 수 있게 된다. 이때의 특정 작업(side effect)란 렌더링 된 이후에 비동기로 처리되어야하는 부수적인 효과들을 의미한다. useEffect 안에 적는 코드들은 - 복잡한 알고리즘 연산을 해야하는 경우 - 서버와 통신해 데이터를 가져오는 경우 - 타이머를 장착해야하는 경우 - ... 이제 함수형 컴포넌트에서도 생명 주기 메..

React 2022.07.25