[Redux - 5] Action

리덕스의 action은 애플리케이션의 상태를 변경하기 위해 스토어에 보내는 신호입니다.

액션은 애플리케이션의 어떤 사건이 일어나는 것을 설명하는 객체입니다.

액션의 구조

기본적으로 액션은 type 필드를 필수로 갖는 객체입니다. type은 액션의 종류를 나타내는 문자열입니다.

{
  type: 'INCREMENT'
}

또한 추가적인 데이터를 포함할 수도 있습니다. 

이런 추가적인 데이터를 "payload" 또는 "meta" 데이터라고 부르기도 합니다.

{
  type: 'ADD_TODO',
  payload: {
    id: 1,
    text: 'Learn Redux'
  }
}

액션의 생성자

액션 생성자는 액션 객체를 생성하는 함수입니다.

액션 생성자는 애플리케이션 로직에서 액션 객체를 쉽게 만들기 위해 사용됩니다.

function addTodo(text) {
  return {
    type: 'ADD_TODO',
    payload: {
      id: Date.now(),
      text
    }
  };
}

 

이 액션 생성자를 사용하면 다음과 같이 액션 객체를 만들 수 있습니다.

const action = addTodo('Learn Redux');
store.dispatch(action);

 

또는 단순히 다음과 같이 직접 디스패치할 수도 있습니다.

store.dispatch(addTodo('Learn Redux'));

 

bindActionCreators