Redux

Redux를 사용하는 이유

context API를 사용하는 이유처럼, Redux는 state관리, 재사용 및 props 드릴링을 방지하기위해 사용한다.

설치
npm install @reduxjs/toolkit

store.js와 같은 파일을 생성하여, 해당 파일에서 state들을 보관, 변환등 관리한다.

Redux 사용

let user = createSlice({
  name: "user",
  initialState: "geun99",
  reducers: {
    changeName() {
      return "redux";
    },
  },
});

export let { changeName } = user.actions;

name는 변수명을, initialState에는 초기값을 reducer에는 변경함수등을 넣을수 있다.
이러한 변수를 사용하기위해서, useSelector와 useDispatch를 사용한다.

Redux에서 object 변경하는 방법

let user = createSlice({
  name: "user",
  initialState: { name: "이창근", age: 24 },
  reducers: {
    changeName(state) {
      state.name = "redux";
    },
  },
});

다음과 같이 변경 함수에 파라미터를 넣어서 오브젝트의 특정 요소만 변경할 수 있다.