redux-saga学习(三)

redux-saga

yarn add redux-saga

  • redux-saga简单使用
import { createStore ,applyMiddleware ,compose } from 'redux';
import createSagaMiddleware from 'redux-saga';
import mySaga from './sagas';
// import thunk from 'redux-thunk';
import  reducer  from './reducer';
const sagaMiddleware = createSagaMiddleware()
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ }) : compose;
const enhancer = composeEnhancers(
    applyMiddleware(sagaMiddleware)
  );

const store = createStore(
    reducer,
    enhancer
);
sagaMiddleware.run(mySaga);
export default store;
  • 对应创建sagas.js,把对应的请求统一放在sagas.js来管理
import {  put, takeEvery } from 'redux-saga/effects';
import { GET_LIST_DATA } from './actionTypes';
import { initList } from './actionCreators';
import axios from 'axios';
function* fetchUser(action) {
    try {
        let  resData =  yield  axios.get('/list.json');
       
        const data = resData.data.list;
        console.log(data);
        yield put(initList(data))
    } catch (e) {
       console.log("网络请求失败")
    }
 }
function* mySaga() {
yield takeEvery(GET_LIST_DATA, fetchUser);
  }
  
export default mySaga;
    原文作者:suipa
    原文地址: https://segmentfault.com/a/1190000018894267
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞