일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
Tags
- 자바스크립트
- array
- 리액트
- 타입스크립트
- firebase
- 비트 연산자
- Frontend
- Reducer
- Redux
- 프리온보딩
- 프론트엔드
- es6
- 브라우저
- TypeScript
- v9
- 컴포넌트
- react
- JS
- 프로그래머스
- Component
- state
- localstorage
- 알고리즘
- til
- JavaScript
- 파이어베이스
- react localStorage
- CORS
- 원티드
- axios
Archives
- Today
- Total
목록useReducer (1)
도리쓰에러쓰

1. useReducer() 상태를 업데이트할 때 useState()를 주로 사용했는데 useReducer()로도 상태 업데이트가 가능하다. useReducer()를 사용하면 컴포넌트의 상태 업데이트 로직을 컴포넌트에서 분리시킬 수 있다. 우선 reducer는 현재 상태와 액션 객체를 파라미터로 받아와 새로운 상태를 반환해주는 함수이다. function reducer(state, action) { // 새로운 상태를 만드는 로직 // const nextState = ... return nextState; } reducer에서 반환되는 상태는 컴포넌트가 지닐 새로운 상태이다. 여기서 action은 업데이트를 위한 정보를 가지고 있다. action의 예시는 아래 코드를 참고하면 좋을 것 같다. // 카운터에..
React/React
2022. 7. 16. 21:48