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

Ada*_*Tal 95 javascript reactjs redux redux-saga react-redux

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

我的问题

我有一个由以下部分组成的应用程序:

import { select } from 'redux-saga';
...
let data = yield select(stateSelectorFunction);
Run Code Online (Sandbox Code Playgroud)

每个部分都是一个不同的组件,它有自己的减速器,传奇,动作和状态.

工具栏有一个保存按钮,可以调度"SAVE_PROJECT"动作类型.问题是我不希望工具栏知道项目(它有更多的职责,我只是希望它发送类型的动作).

我有一个项目相关的传奇,它听取了"SAVE_PROJECT":

import { select } from 'redux-saga';
...
let data = yield select(stateSelectorFunction);
Run Code Online (Sandbox Code Playgroud)

我无法从传奇中的redux状态获得该项目.

我不认为我可以在当前项目reducer中听取"SAVE_PROJECT"事件,然后在reducer内部获取项目并向项目发送不同的操作.

我真的不希望我的工具栏知道整个状态树,并为每个动作发送与动作相关的任何内容.

我怎样才能将状态传递给传奇?还是只有国家的相关部分?

Nic*_*Gnd 177

正如@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});
  }
}
Run Code Online (Sandbox Code Playgroud)

除了@markerikson 建议的文档之外,还有一个非常好的视频教程,由D. Abramov解释如何使用selectorsRedux.在Twitter上查看这个有趣的帖子.

  • 正是我想要的......我无法相信我错过了它 (3认同)

mar*_*son 27

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

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