25.redux中间件redux-thunk和redux-saga

redux-thunk通过对dispatch进行升级，让dispatch可以接收函数

redux-thunk可以将异步逻辑放在actionCreator里面

redux-saga和redux-thunk作用类似

store action的中间

redux-saga提供许多api put takeEvey takeLast ..

redux-thunk 只是让dispatch 可以接收函数

 

store.js 配置使用redux-saga

const sagaMiddleware = createSagaMiddleware()

// mount it on the Store

const store = createStore(

reducer,

applyMiddleware(sagaMiddleware)

)

 

// then run the saga

sagaMiddleware.run(mySaga)

export default store

 

saga.js 将请求抽到saga.js中

function* fetchInitList(action) {

try{

const res = yield axios.get('/apis/getMv');

const action = initItem(res.data)

yield put(action);

}catch(e){

console.log("网络请求失败！")

}

 

}

function* mySaga() {

// yield takeLatest("USER_FETCH_REQUESTED", fetchUser);

yield takeEvery(GET_INIT_List, fetchInitList);

}

 

export default mySaga;

 

使用

store.dispatch(getInitList())