将 redux-saga 转换为 redux-observable答案

【问题标题】：Converting redux-saga to redux-observable将 redux-saga 转换为 redux-observable
【发布时间】：2018-02-24 11:45:05
【问题描述】：

我是响应式编程的新手，想将以下代码从 redux-saga 翻译成 redux-observable。

这个想法是等待一些 API 调用，等待 5 秒然后调度另一个动作。

function* mySaga(action) {
  const response = yield call(someApiCall);
  yield call(delay, 5000);
  yield put({ type: 'ACTION' });
}

这是我在 redux-observable 中的做法：

action$
  .ofType('SOME_ACTION')
  .mergeMap(someApiCall)
  .delay(5000)
  .map(() => ({ type: 'ACTION' }))

【问题讨论】：

标签： redux-saga redux-observable

【解决方案1】：

假设您在原始示例中省略了 yield takeEvery('SOME_ACTION', mySaga) 内容，您的翻译是准确的。

不过，我建议隔离您的 Observable 链；将所有要申请的东西放在someApiCall() 之后，在mergeMap 内：

action$
  .ofType('SOME_ACTION')
  .mergeMap(action =>
    someApiCall()
      .delay(5000)
      .map(() => ({ type: 'ACTION' }))
  )

即使它在您的示例中没有任何功能差异，但如果您或团队成员后来加入并尝试添加错误处理，那么您不要让错误冒泡到 mergeMap 之外：

action$
  .ofType('SOME_ACTION')
  .mergeMap(action =>
    someApiCall()
      .delay(5000)
      .map(() => ({ type: 'ACTION' }))
      .catch(error => Observable.of({
        type: 'SOME_ACTION_FAILED',
        payload: error
      }))
  )

如果您将catch 放在顶级Observable 上，在mergeMap 之后，错误会冒泡到顶级链，虽然您会发现错误，但您的史诗将不再监听未来的行动。

如果不清楚原因，我建议了解更多有关 Observables + 操作符如何工作的信息——我保证没那么可怕！这是一个很棒的视频，它甚至涉及“隔离你的可观察链”以在正确的点捕捉错误。 https://youtu.be/3LKMwkuK0ZE?t=20m15s

【讨论】：