Principios Básicos de Redux의 원리

En Redux는 conceptos que es importante conocerlos y por eso hoy hablaremos sobre ellos를 존재합니다.

리덕스: 액션

En Redux는 las Actions que no son más que las definiciones de Acciones que realizara nuestro reducer para manipular el estado de nuestra aplicación입니다. 예를 들어:

export const SET_LOGIN_USER ='SET_LOGIN_USER';

Como podemos notarlo la Action es lo que queremos ejecutar, puedes definir cuantas Actions se requieran, pero ten cuidado porque podrían llegar a ser difíciles de manejar en caso de no utilizarlos correctamente.

Redux: 액션 크리에이터

Las ActionCreator 아들 las funciones que nos ayudan a crear una Action estas hacen que recibamos un objeto y lo transformemos a un objeto de redux, el cual tiene una type y 유엔 payload .

ActionCreator는 새로운 아카이브 actionCreator에서 importaremos를 가져오므로 actionTypes 아카이브를 생성할 수 없습니다.

import * as ActionTypes from './actionTypes'
export const SetUserLogin = (userAccount)=> {
   return {
      Type: ActionTypes.SET_LOGIN_USER,
      payload: {
         userAccount
      }
   }
}

Redux: 감속기

Finalmente, el concepto que le da esencia a Redux, los reducers, estos no son más que funciones puras, igual que los anteriores, pero que son las que hacen que nuestra implementación de Redux, llegue a feliz termino.

Los reducer는 ActionTypes와 새로운 응용 프로그램 수정을 허용합니다. Para este ejemplo tendremos siempre en cuenta que hemos creado el archivo actionTypes .

import * as ActionTypes from './actionTypes';

const userDefaultState = { userId: '', userName: '', isLogged: false }

export const userLoginReducer = (state = userDefaultState, action) => {
    switch (action.type) {
        case actionTypes.SET_USER_LOGIN:
            let user = action.payload.userAccount;
            state = {...state, userId: user.userId, userName: user.userName, isLogged: user.isLogged }
            return state;
        default:
            return state;
    }
}

Como observamos, el reducer ejecuta la action que ha sido disparada dispatch desde un componente por nuestro usuario.

De este modo ya hemos visto los tres elementos necesarios para implementer Redux. Hasta la proxima.

¡해피 해킹!