전체 글218 redux-promise-middleware redux-promise-middleware 사용하기 npm install redux-promise-middleware users.js import { GET_USERS_FAIL, GET_USERS_FULLFILLED, GET_USERS_PENDING, GET_USERS_REJECTED, GET_USERS_START, GET_USERS_SUCCESS } from "../actions"; const initialState = { loading: false, data: [], error: null }; export default function users(state = initialState, action) { if(action.type === GET_USERS_START || action.type === .. 2022. 2. 4. redux-thunk store.js import { applyMiddleware, createStore } from 'redux' import todoApp from './reducers/reducer' import {composeWithDevTools} from 'redux-devtools-extension'; import thunk from 'redux-thunk'; const store = createStore(todoApp, composeWithDevTools(applyMiddleware(thunk))); export default store; actions.js import axios from "axios"; export const ADD_TODO = "ADD_TODO" export const COMPLETE_TO.. 2022. 2. 3. redux-devtools 설치 npm i redux-devtools-extension -D composeWithDevTools 사용 import { applyMiddleware, createStore } from 'redux' import todoApp from './reducers/reducer' import {composeWithDevTools} from 'redux-devtools-extension'; import thunk from 'redux-thunk'; //applyMiddleware는 함수를 리턴할떄만 반응하고 객체를 리턴할때는 const store = createStore(todoApp, composeWithDevTools(applyMiddleware(thunk))); export default store; 2022. 2. 2. 리덕스 미들웨어 미들웨어가 디스패치 앞뒤에 코드를 추가할 수 있게 해준다. 미들웨어가 여러개이면 미들웨어가 순차적으로 실행된다. 2단계가 있음 스토어를 만들때 미들웨어를 설정하는 부분 {createStore, applyMiddleware} from redux 디스패치가 호출될떄 실제로 미들웨어를 통과하는 부분 dispatch 메소드를 통해 store로 가고있는 액션을 가로채는 코드 직접 만들어보기 store.js import { applyMiddleware, createStore } from 'redux' import todoApp from './reducers/reducer' function middleware1(store){ console.log("middleware1", 0); return(next) => { co.. 2022. 2. 1. 이전 1 ··· 5 6 7 8 9 10 11 ··· 55 다음 반응형
