概念:
Redux-saga是一个用于管理redux应用异步操作的中间件,Redux-saga通过创建sagas将所有异步操作逻辑收集在一个地方集中处理,可以用来代替Redux-thunk中间件,独立一个文件进行处理
具体形式:
1.reducer负责处理action的stage更新
2.sagas负责协调那些复杂或者异步的操作
原理
- Redux-saga是通过genetator函数创建的
- sagas监听发起的action,然后决定基于哪个action来做什么
- 在Redux-saga中,所以的任务都通过yield Effects来完成
- Redux-saga为各项任务提供了各种Effects创建器,让我们可以用同步的方式来写异步代码
- 名词:put(action) takeEvery(actionTypes,方法)
运行
使用
安装 npm install --save redux-saga
目录结构
在store新建saga.js
在store下的index引用saga
import {createStore,applyMiddleware,compose} from 'redux';
import reducer from './reducer';
/*使用redux-sagas*
/import createSagaWiddleware from "redux-saga"
import mySaga from "./saga"
const sagaMiddleware = createSagaWiddleware();
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;GitHub路径