티스토리 뷰

Front-end/Redux

Redux 흐름

ekki88 2022. 11. 3. 13:40

action 정의한다

액션디렉토리에 액션 타입파일을 만들어서

액션이름을 상수형태로 만들고 다른파일에서 불러올수잇도록 만든다

대문자와_를 사용해서 만든다

export const PLUS = 'PLUS'

 

액션 생성자함수를 통해 정의한다

-> 왜? 

액션을 그때그때 객체를 만들면 귀찮아서..?

액션 생성자는 미리 정의해둔 액션이름을 불러와서 카멜케이스로 작성함

payload가 있는경우에 인자로 넣어줌 

import *as types from '액션타입정의한곳'

export function plus(payload) {
	return {
    	type: types.PLUS
        payload:
    }
}

 

액션 객체

{

type: 액션의 종류를 한번에 식별할 수 있는 문자열 또는 심볼

payload: 액션의 실행에 필요한 임의 데이터

}

종류에 따라 리듀서가 일을 함

 

 

여기서 type을 어떻게 읽는걸까?

액션객체 이벤트 드리븐과 같은 개념

-> 이벤트 드리븐이란?

특정 서비스에서 다른 서비스가 관심을 가질 수 있는 일부 작업을 수행할 때 해당 서비스는 이벤트(작업의 기록)를 생성

 

초기값을 생성한다

-> 왜?

리듀서가 처음 호출될 때, state값은 undefined가 됨 초깃값을 지정해서 액션이 발생하기 전에 이 케이스에 대해 처리

 

리듀서 작성

리듀서란? 함수이다

상태값과 액션을 받아 스토어에서 새로운 상태를 만들어내는 함수 

 

크리에이터 스토어에 인자로 리듀서 넣기

 

 

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
글 보관함