使用Redux-Sagas链接异步作用

Question

我有一个称为onitialiseapp的动作，显然是初始化了该应用程序。我需要从服务器中进行一些事情，例如用户信息，样式和有关正在显示的页面的一些详细信息（这是一个页面应用程序）。我正在使用redux-sagas，我无法找到一种链条异步动作的方法，以便它们以顺序发生，而不是平行。

我需要在请求任何样式信息之前要调用用户信息，因为在服务器端，用户的调用会访问并检索用户并在会话中设置一些内容。由于目前正在并行请求样式，因此由于尚未在服务器上设置用户而显示错误。

所以我已经尝试使用put.sync，但这似乎不起作用，但是到目前

private *invokeAndWaitOn(action: IAction<any>) {
    const putSync = (put as any).sync; // The typings file for redux-sagas does not yet include put.sync
    yield putSync(action);      
}
private *invokeArrayOfActions(actions: IAction<any>[]) {
    for (let action of actions) {
        yield* this.invokeAndWaitOn(action);
    }
}

，但这似乎不起作用，我找不到任何如何正确使用redux-saga put.sync效果的示例。

任何人都可以看到我做错了什么，或者有更好/正确的方法可以做到这一点？

预先感谢。

Answer 1

让我们假设为了此用例，您有两个操作fetchUser和fetchStyle。您想在第一个动作之后发射第二动作

在这种情况下，您需要还有其他两个动作才能处理 Success 和错误，以便您的动作如下：

用于用户提取：fetchUser，fetchUserSuccess和fetchUserError

for style 提取： fetchStyle， fetchStyleSuccess和 fetchStyleError

然后包装整个获取过程，假设sagaFunction如下：

private* fetchUserSaga() {
  try {
    yield put(fetchUser());
    let response = yield call(/* fetchUser API function */])
    yield put(fetchUserSuccess(response));
  } catch (err) {
    yield put(fetchUserFailure(err));
  }
}

提示：您必须使用 redux-saga CC_11的效果。

private* fetchStyleSaga() {
  try {
    yield put(fetchStyle());
    let response = yield call(/* fetchStyle API function */])
    yield put(fetchStyleSuccess(response));
  } catch (err) {
    yield put(fetchStyleFailure(err));
  }
}

然后将这些传说函数传递给调用发电机函数，如下：

/*
const sagas = [
  fetchUserSaga,
  fetchStyleSaga,
]; */
private* invokeArrayOfSagas(sagas: ISaga<any>[]) {
  for (let saga of sagas) {
    yield call(saga()); /* saga: fetchUserSaga || fetchStyleSaga */
  }
}

这将等到 fetchusersaga 完成，然后开始 fetchstylesaga 。

更多信息：如果要分组一些操作并与之并行称呼它们，则另一个动作取决于它们，可以在一个yield关键字的数组中屈服它们，请在此处查看更多。