Question

我对反应式编程很陌生，并希望将以下代码从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' }))

Answer 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

如果你将mergeMap放在顶级Observable上，在comment之后，错误会冒泡到顶级链，虽然你会发现错误，但你的史诗会不会更长时间倾听未来的行动。

如果不清楚为什么，我建议更多地了解Observables +运算符的工作原理 - 我保证不会那么可怕！这是一个很棒的视频，甚至触及“隔离你的可观察链”，以便在正确的点捕获错误。 https://youtu.be/3LKMwkuK0ZE?t=20m15s

将redux-saga转换为redux-observable

1 个答案: