관리 메뉴

공부기록용

React_action 객체 본문

📚강의록📚/스파르타)React

React_action 객체

과부하가즈아 2023. 7. 1. 12:50

💡action객체💡

액션 객체는 상태 변경을 나타내는 일종의 "이벤트"이다.

 

Redux에서는 상태 변경을 위해 액션 객체를 생성하고, 이를 Redux 스토어로 보내서 상태를 업데이트한다. 

{
  type: "ACTION_TYPE",
  payload: { /* 데이터 */ }
}
  • type: 액션의 종류를 식별하는 문자열.
    • 주로 대문자와 스네이크 케이스(ACTION_TYPE)로 작성된다.
    • 이를 통해 리듀서(Reducer)에서 어떤 상태 변경이 발생해야 하는지 식별할 수 있다.
  • payload (선택적): 액션과 관련된 데이터를 포함하는 객체.
    • 필요에 따라 액션과 함께 전달되어야 하는 추가 데이터가 있다면 payload 속성을 사용하여 해당 데이터를 포함시킬 수 있다.

액션 객체는 주로 "액션 생성자(Action Creator)" 함수를 통해 생성된다.

 

액션 생성자 함수는 액션 객체를 반환하는 함수로, 액션 객체의 생성을 단순화하고 일관된 형식을 유지하기 위해 사용된다.

function addTodoItem(item) {
  return {
    type: "ADD_TODO",
    payload: item
  };
}

addTodoItem 함수는 ADD_TODO라는 액션 타입을 가지는 액션 객체를 반환한다.

 

 

payload 속성은 item이라는 데이터를 가지고 있습니다. item은 새로운 할 일에 대한 정보를 담고 있을 수 있다.

 

이렇게 생성된 액션 객체는 Redux 스토어의 dispatch 함수를 사용하여 Redux에 전달된다.

 

dispatch 함수는 액션을 스토어로 보내서 상태 변경을 트리거하고, 이렇게 되면 리듀서(Reducer)라는 함수가 호출되어 현재 상태와 액션 객체를 받아와서 새로운 상태를 계산한다. 그리고 그 새로운 상태가 전역 상태로 업데이트되어 애플리케이션 전체에 적용된다.

 

액션 객체와 dispatch 함수를 통해 액션을 Redux 스토어로 보내면, 해당 액션을 처리하는 리듀서가 실행되어 상태를 변경할 수 있게 된다. 이를 통해 여러 컴포넌트에서 동일한 액션을 dispatch하여 상태를 업데이트하고, 애플리케이션의 상태를 일관성 있게 관리할 수 있다.

 

 

Comments