Redux toolkits는 redux에서 공식적으로 지원하는 redux 개발 도구이다.
이와 같은 문제점들을 해결하기 위해서 사용한다.
기존 redux와 toolkit을 적용한 소스를 보며 비교하는 식의 글
const add = "add"
const addToDo = () => {
return {
type: add,
text
}
}
const reducer = (state = [], action) => {
switch(action.type){
case addToDo:
return [...state, {text: action.text, id: Date.now()}];
default:
return state;
}
}
const addToDo = creactAction("add");
const reducer = (state = [], action) => {
switch(action.type) {
case addToDo.type:
return [...state, {text: action.payload, id: Date.now()}];
default:
return state;
}
}
createAction 이라는 function으로 대체를 하였다.
함수 내에 지정한 string이 자동으로 type으로 지정이 된다.
기존에 return 할 값에서 action.text 에서 action.payload로 바뀐 건 createAction 은 type과 payload로 제공을 하기에 바뀌었다.