react hook2 React Hook 이해하기 - useEffect (Effect Hook) useEffect가 하는 일 리액트에게 컴포넌트가 렌더링 된 이후에 어떤 일을 수행해야 하는지를 말한다. 리액트에게 넘긴 함수를 기억했다가 DOM 업데이트를 수행한 후 Effect를 불러온다. useEffect를 컴포넌트 안에서 불러내는 이유 useEffect를 컴포넌트 내부에 둠으로써 effect를 통해 우리가 지정한 state 또는 props에 접근 할 수 있게 되고, 특별한 API 없이도 값을 가져올 수 있기 때문이다. useEffect는 렌더링 이후 매번 수행되나? useEffect는 렌더링 이후 매번 수행 된다. ( 첫번째 렌더링 ~ 이후 모든 업데이트에서 수행 됨 ) 마운팅, 업데이트라는 방식으로 생각하는 것 보다 -> 렌더링 이후에 발생 하는 것 이라고 생각하는 것이 쉽다. useEffect.. 2020. 5. 25. React Hook 이해하기 - useState (State Hook) React Hook, useState useState는 state를 함수 컴포넌트 안에서 사용할 수 있도록 해준다. 기존에는 state를 추가하고, 변경하고 싶을 때 클래스(Class) 컴포넌트로 바꾸어 사용했으나, 이제 함수형 컴포넌트안에서 Hook을 이용해 state를 사용할 수 있다. Hook의 규칙 최상위 레벨에서만 Hook을 호출해야 한다. 오직 React 함수 내에서만 Hook을 호출해야 한다. useState를 사용하여 state 초기화 하기 import React, { useState } from 'react'; export default function Sample() { // 새로운 state 변수 선언 및 할당 const [count, setCount] = useState(0); } .. 2020. 5. 25. 이전 1 다음
