useDispatch, reducer

Steve·2023년 8월 30일
0

이해가 아니라 가져다 쓰는거임.

function reducer(state = initialState, action) {
  return state;
}

let store = createStore(reducer);

사용하고자 하는 곳에서

function App() {
  const weight = useSelector((state) => state);
  const dispatch = useDispatch();
  return (
    <div className="App">
      <p>몸무게 : {weight}</p>
      <button
        onClick={() => {
          dispatch({ type: "증가" });
        }}
      >
        더하기
      </button>
    </div>
  );
}

모든 컴포넌트가 props없이 state직접 꺼내 쓸 수 있음

useSelector :
useDispatch :

상태관리 용이

문제 생겼을떄 해당 컴포넌트 또는 수정방법 정의해놓은 곳에서만 확인하면 됨

store.js에 state수정방법을 정의해놓음
switch case...

각 컴포넌트에서 state 수정 요청만 가능

컴포넌트에서 state 수정요청하려면? >> dispatch

리덕스랑 똑같은 기능을 하는 라이브러리 사용할수도 있음
MobX, Overmind.js Recoil

profile
Front-Dev

0개의 댓글