在 Redux Observable 中保持史诗直到收到操作

Posted 2023-03-28

【中文标题】在 Redux Observable 中保持史诗直到收到操作

【英文标题】：Hold epic in Redux Observable until action is received

【发布时间】：2017-11-12 20:36:42

【问题描述】：

我是 rxjs 和 redux-observables 的新手

我有两部史诗：

export const appInit = action$ =>
  action$.ofType(actions.appInitRequest)
  .take(1)
  .switchMap(() => actions.fetchData())

和

export const navigation = ($action, getState) =>
  $action.ofType(actions.locationChange)
  .do(console.log)

App Init 触发操作以获取数据， 是否可以保持导航史诗直到获取数据完成？因此，如果收到导航操作并且未完成获取数据，我们将等到获取数据完成（调度 action.fetchDataSuccess）然后继续导航史诗流程？

我尝试了以下代码，但是 fetchDataSuccess 之后的每个请求都等待新的 fetchDataSuccess

export const navigation = ($action, getState) =>
  $action.ofType(actions.locationChange)
    .switchMap((payload: pathname) =>
      $action.ofType(action.fetchDataSuccess)
      .take(1)

【参考方案1】：

尝试使用withLatestFrom:

export const navigation = ($action, getState) =>
  $action.ofType(actions.locationChange)
    .withLatestFrom(appInit)
    .filter(([locationChangeEvent, appInitEvent]) => 
      return /* check that app inited successfully */
    )
    .map(([locationChangeEvent]) => locationChangeEvent)
    .do(console.log)