前言
React的作用View层次的前端框架,自然少不了很多中间件(Redux Middleware)做数据处理, 而redux-saga就是其中之一,目前这个中间件在网上的资料还是比较少,估计应用的不是很广泛,但是如果使用得当,将会事半功倍的效果,下面仔细介绍一个这个中间件的具体使用流程和应用场景。
redux-saga简介
Redux-saga是Redux的一个中间件,主要集中处理react架构中的异步处理工作,被定义为generator(ES6)的形式,采用监听的形式进行工作。
redux-saga安装
使用npm进行安装:
npm install --save redux-saga
或者使用yarn:
yarn add redux-saga
redux-saga常用方法解释
redux Effects
Effect 是一个 javascript 对象,可以通过 yield 传达给 sagaMiddleware 进行执行在, 如果我们应用redux-saga,所有的 Effect 都必须被 yield 才会执行。
举个例子,我们要改写下面这行代码:
yield fetch(url);
应用saga:
yield call(fetch, url)
take
等待 dispatch 匹配某个 action 。
比如下面这个例子:
....
while (true) {
yield take('CLICK_Action');
yield fork(clickButtonSaga);
}
....
put
触发某个action, 作用和dispatch相同:
yield put(