상태관리저장소.
리덕스는 하나의 저장소 (store) 안에 있는 객체트리에 state를 저장하는 것.
저장된 state값을 변경할 유일한 방법은
무슨 일이 일어날지를 서술한 객체 "액션(action)"보내는 것 뿐이다.
액션을 받아 객체를 변경하는 것은 "리듀서(reducer)"가 담당한다.
리덕스에서 저장하고 있는 상태값(데이터)
딕셔너리 형태로 { [ key ] : value } 값을 갖는다.
갖고있는 데이터가 변경될 때 발생하는 것.
액션은 객체, type은 이름표 같은 것.
리덕스 안의 데이터를 수정하고 싶을 때는 🏷 나 이거 수정할게! 라고 말하고 실제로 데이터를 수정하고 알려줘야 함.
{type : "CHANGE_STATE" , data {...} }
type : "CHANGE_STATE" = '🏷 나 이거 수정할게!'라는 이름
data {...} = 내가 바꿀 데이터
액션생성함수 => 액션을 만들기 위해 존재한다.
액션을 return해주는 함수
const changeState = (new_data *여기에 뭔가를 넣으면* ) => {
return {
type : "CHANGE_STATE"
data : new_data
}
}
new_data 를 이렇게 저렇게 작업해서 '액션객체'라는 걸로 만들어서 return 한다.
그걸 changState 라고 부르겠다.
=>이걸 왜 하나? => 전역으로 데이터를 바꾸고 싶으니까!
데이터를 실제로 바꾸는 곳.
Action을 dispatch 하면 자동으로 Reducer가 실행된다.
Reducer는 Action이 '바꿔줘'라고 한 내용에 맞게 data를 변경한다.
const initialState = {
name : 'velog'
}
function reducer (state = initialState, action) {
switch (action.type){
case CHANGE_STATE :
return {name : 'velog'};
default:
return false;
}
}
( state = initialState, action )
Parameter = 매개변수
case CHANGE_STATE
'어떻게 바꿔줘'의 이름 = action
ㄴ case 별로 = 각 action 마다 다른 처리를 할 수 있다.
store 안에는 state만 있는 게 아니라 Reducer들과 내장함수인 getState, dispatch, sudscribe 도 있다.
dispatch 는 action을 발생시킨다. => '나 이거 바꿔줘' 를 요청한다.
실제로 변경을 맡은 건 Reducer 이다.
< 정 리 >