如何从redux-saga函数中的状态/商店中获取内容?

时间:2016-06-12 09:53:14

标签: javascript reactjs redux react-redux redux-saga

如何在saga函数中访问redux状态?

简答:

import { select } from 'redux-saga';
...
let data = yield select(stateSelectorFunction);

3 个答案:

答案 0 :(得分:137)

正如@markerikson所说,redux-saga公开了一个非常有用的API select()来调用状态selector,以便在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建议的doc之外,D. Abramov还有一个非常好的video tutorial,它解释了如何在Redux中使用selectors。还可以在Twitter上查看this有趣的帖子。

答案 1 :(得分:21)

这就是“选择器”功能的用途。你将它们传递给整个状态树,它们返回一些状态。调用选择器的代码不需要知道数据所处状态的 where ,只需要返回它。有关示例,请参阅http://redux.js.org/docs/recipes/ComputingDerivedData.html

在传奇中,select() API可用于执行选择器。

答案 2 :(得分:0)

我使用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)
    }
}