Reducer
-
connect개발/react 2020. 12. 20. 11:08
connect 함수는 리액트 앱의 하위 컴포넌트에서 redux store를 접근하는 것을 가능하게 해주는 역할을 한다. 이 함수를 이용해서 컴포넌트 단에서 redux store에 접근하고 액션을 호출 할 수 있게 된다. 이번 포스트에서는 간단한 예제로 connect 함수를 통해 redux store를 사용하는 방법을 다뤄보려고 한다. 0. 준비작업 connect 함수 소개를 위해 예제와 텍스트와 숫자를 담당하는 redux를 만들었다. BlogStore.js import { createStore, combineReducers } from 'redux'; const textReducerState = { text: '', name: 'textReducer' }; const textReducer = (state..
-
redux개발/react 2020. 12. 16. 20:28
react는 state를 이용해서 컴포넌트의 상태를 관리하는데 state 하나에 들어가는 element가 많아질수록 관리하기가 힘들어지는 문제가 있다. 그래서 react에서는 redux라는 라이브러리를 이용해서 state를 좀더 쉽게 관리할 수 있게 해줬다. 크게 state를 관리하는 store와 store 를 변경하려는 dispatch 그리고 변경 작업을 일괄 관리하는 reducer로 나뉘는데 이번 포스트에서는 각각에 대해서 간단히만 다뤄보려고 한다. 1. createStore redux로 관리할 state 집합을 만드는 작업이다. 함수의 인자로는 reducer를 받는다. const store = createStore(countReducer); 2. action state를 바꾸기 위해 취하는 액션이다..