Redux Observable 史诗，设置动作之间的超时间隔答案

【问题标题】：Redux Observable epic, set timeout interval between actionsRedux Observable 史诗，设置动作之间的超时间隔
【发布时间】：2019-09-14 08:41:34
【问题描述】：

我有这部史诗：

export const updateIsNotVeganInDbFulfilledEpic: Epic < * , * , * > = (
        action$: ActionsObservable < * > ,
        store: Store < * , * >
    ): Observable < any > =>
    action$.ofType('UPDATE_IS_NOT_VEGAN_IN_DB_FULFILLED').mergeMap(action => {
        return Observable.of(
            updateToastComponentIsOpen(true),
            updateToastComponentMessage(action.payload.response.errors[0])
        )
    })

如何在updateToastComponentIsOpen(true) 2 秒后调度另一个操作 (updateToastComponentIsOpen(false))？

我试过了：

  action$.ofType('UPDATE_IS_NOT_VEGAN_IN_DB_FULFILLED').mergeMap(action => {
    return Observable.of(
      updateToastComponentIsOpen(true),
      updateToastComponentMessage(action.payload.response.errors[0])
    ).timeout(2000)
    .flatMap(function(result) {
      return Observable.of(updateToastComponentIsOpen(false))
    })
  })

但它阻止了前两个动作的调度。

【问题讨论】：

标签： react-redux rxjs5 redux-observable

【解决方案1】：

flatMap 正在吞噬你的前两个动作。此外，timeout 用于在指定时间范围内未到达时发送错误通知。

相反，您想介绍一个delay：

export const updateIsNotVeganInDbFulfilledEpic: Epic<*, *, *> = (
  action$: ActionsObservable<*>,
  store: Store<*, *>
): Observable<any> => action$
  .ofType('UPDATE_IS_NOT_VEGAN_IN_DB_FULFILLED')
  .mergeMap(action =>
    Observable.concat(
      Observable.of(
        updateToastComponentIsOpen(true),
        updateToastComponentMessage(action.payload.response.errors[0]),
      ),
      Observable.of(updateToastComponentIsOpen(false)).delay(2000)
    )
  )

【讨论】：