如何访问 saga 函数内的 redux 状态?
简答:
import { select } from 'redux-saga/effects';
...
let data = yield select(stateSelectorFunction);
如何访问 saga 函数内的 redux 状态?
简答:
import { select } from 'redux-saga/effects';
...
let data = yield select(stateSelectorFunction);
正如@markerikson 已经说过的那样,redux-saga
公开了一个非常有用的 APIselect()
来调用selector
状态上的a ,以便在 saga 中获得它的某些部分。
对于您的示例,一个简单的实现可能是:
/*
* Selector. The query depends by the state shape
*/
export const getProject = (state) => state.project
// Saga
export function* saveProjectTask() {
while(true) {
yield take(SAVE_PROJECT);
let project = yield select(getProject); // <-- get the project
yield call(fetch, '/api/project', { body: project, method: 'PUT' });
yield put({type: SAVE_PROJECT_SUCCESS});
}
}
除了@markerikson推荐的文档之外,D. Abramov还提供了一个非常好的视频教程,其中解释了如何使用selectors
Redux。在 Twitter 上也查看这个有趣的线程。
这就是“选择器”功能的用途。你将整个状态树传递给他们,他们返回状态的一部分。调用选择的代码并不需要知道其中的状态数据,只是它返回。有关一些示例,请参阅http://redux.js.org/docs/recipes/ComputingDerivedData.html。
在 saga 中,select()
API可用于执行选择器。
我使用 eventChannel 从生成器函数中的回调中分派动作
import {eventChannel} from 'redux-saga';
import {call, take} from 'redux-saga/effects';
function createEventChannel(setEmitter) {
return eventChannel(emitter => {
setEmitter(emitter)
return () => {
}
}
)
}
function* YourSaga(){
let emitter;
const internalEvents = yield call(createEventChannel, em => emitter = em)
const scopedCallback = () => {
emitter({type, payload})
}
while(true){
const action = yield take(internalEvents)
yield put(action)
}
}