redux-saga
- 安装redux-saga(参考githup 地址:链接描述)
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;