왕가's history

useReducer 단순히 state 값을 저장하는 것이 아니라, state를 바꾸기 위한 로직, 함수 등을 관리할 수 있는데, 이럴 때 useReducer를 사용하면 관리에 용이합니다. 간단히 말해 state를 바꾸기 위한 여러 함수들을 하나로 묶어서 관리할 수 있다고 보면 됩니다. const [state, dispatch] = useReducer(reducer, initialState); 하나의 state에 dispatch를 통해 값을 변환해 줍니다. (dispatch가 setState역할을 한다고 보면 될 듯싶습니다.) state : 컴포넌트에서의 state dispatch: action을 발생하는 함수 (setState와 비슷) reducer : reducer 정의 initialState : 초기..

Hook React에서 함수형 컴포넌트를 사용 시, state와 다른 React 기능들을 사용할 수 있게 해 줌. 주의 사항 Hook은 최상위, 함수의 제일 바닥에서만 사용해야 한다. 반목문, 조건문, Hook 내부 등에서 호출하면 안 된다. Hook은 React 함수 내에서 사용 Custom Hook에서 Hook을 호출할 것 Hook은 호출되는 순서가 중요하다. React에서 제공해 주는 여러 기능들? 함수들?로 보면 될 것 같습니다.

useState Component가 가지고 있는 상태값으로 컴포넌트 내부에서의 동적 데이터입니다. 흔히 많이 사용되는 변수라고 생각하면되지만, 아래와같은 특징이 있기 때문에 변수랑은 느낌만 같지 많이 다릅니다. const [변수이름, set변수이름] = useState(초기값); set변수이름은 다른 이름을 넣어도 되고, 선언하지 않아도 상관없습니다. 변수에 값을 직접 대입하는 것이 아니라, set을 통해 값을 대입해줍니다. state값이 변하게 되면 UI가 리렌더링 된다. useState는 비동기로 동작한다. 예 HTML 삽입 미리보기할 수 없는 소스 input태그의 값을 입력해 주면서 content라는 state값을 확인할 수 있게 작성하였다. content선언할 때는 "" 빈문자열로 초기값을 설정해..