ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • Redux - Action
    Redux/Basic 2021. 6. 17. 19:10

     

    - 리덕스의 액션이란?

    • 액션은 객체(object)
    • payload가 유무에 따라 두 가지 형태 존재
      • { type: 'ADD' } // payload x
      • { type: 'ADD', params: '1' } // payload o

    • type은 필수 프로퍼티이며 문자열
    • Store에 전달이 되면 Store의 상태를 변경하는 용도로 사용

    - 리덕스의 액션 생성자(Action Creator)란?

    • 액션을 생성하는 함수
    • 함수를 통해 액션을 생성해서 액션 객체를 리턴
    • ex) function 액션생성자(...args) { return 액션; }

    - 리덕스의 액션의 역할

    • 액션 생성자를 통해 액션 생성
    • 생성된 액션 객체를 Redux Store에 전달
    • Redux Store가 액션 객체를 받으면 Store의 상태 값이 변경
    • 변경된 상태 값에 의해 상태를 이용하고 있는 컴포넌트 변경
    • 액션은 Store에 보내는 일종의 Input이라고 생각할 수 있음

    - 액션 준비과정

    • 액션의 타입을 정의하여 변수를 빼는 단계
      • 강제는 아님
      • 그냥 타입을 문자열로 넣기에는 실수를 유발할 가능성이 큼
      • 미리 정의한 변수를 사용하면 스펠링에 주의를 덜 기울여도 됨

    • 액션 객체를 만들어 내는 함수를 만드는 단계
      • 하나의 액션 객체를 만들기 위해 하나의 함수 생성
      • 액션의 타입은 미리 정의한 타입 변수로 부터 가져와서 사용
    export const ADD_TODO = 'ADD_TODO';
    
    function addTodo(todo) {
      return { type: ADD_TODO, todo };
    }
    

    'Redux > Basic' 카테고리의 다른 글

    Redux - Store  (0) 2022.01.01
    Redux - createStore  (0) 2021.12.31
    Redux - Reducer  (0) 2021.06.17

    댓글

Designed by Tistory.