在 redux-observables 的 Epic 结束时调度操作

Question

我在 Redux Observables 中有以下史诗，我想分派 ApplicantAction 的另一种类型（具有不同的 reducer）的动作，因为我需要 response 中传递的数据，我怎么能这样做？

const updateApplicantEpic: Epic<ApplicantAction, ApplicantAction, State> = action$ =>
  action$.pipe(
    filter(isOfType(EApplicantAction.UpdateApplicant)),
    mergeMap(action =>
      from(
        createAxiosInstance().put(`/applicant/edit/${action.applicantId}`, action.applicant),
      ).pipe(
        map(({ status }) => updatedApplicant(status, action.applicant)),
        startWith(updatingApplicant()),
        catchError(({ response }) => of(updatingApplicantFailed(response.status))),
      ),
    ),
  );

我想使用以下数据调用名为 setNotification() 的操作：

{
   id: action.notificationId,
   status: response.status
   title: response.data.title,
   message: response.data.messages?.join('\n'),
   open: false
}

我的第二个动作如下所示

const setNotificationEpic: Epic<NotificationAction, NotificationAction, State> = action$ =>
  action$.pipe(
    filter(isOfType(ENotificationAction.SetNotification)),
    map(action => setNotificationSuccess(action.notification)),
  );

Answer 1

有几种方法可以调度第二个操作，具体取决于您的要求。 mergeMap 运算符是一种简单的方法来调度多个操作以响应一个事件。这是您的示例史诗的简单改编：

const updateApplicantEpic: Epic<ApplicantAction, ApplicantAction, State> = action$ =>
  action$.pipe(
    filter(isOfType(EApplicantAction.UpdateApplicant)),
    mergeMap(action =>
      from(
        createAxiosInstance().put(`/applicant/edit/${action.applicantId}`, action.applicant),
      ).pipe(
        mergeMap((response) => of(
          updatedApplicant(response.status, action.applicant),
          setNotification(response),
        )),
        startWith(updatingApplicant()),
        catchError(({ response }) => of(updatingApplicantFailed(response.status))),
      ),
    ),
  );

我在这里假设您有一个动作创建器函数 setNotification，它接收一个 axios 响应和 returns 一个动作。 TypeScript 签名可能类似于：

setNotification(response: Response): NotificationAction

在 redux-observables 的 Epic 结束时调度操作

Dispatch action at the end of Epic with redux-observables

javascript

typescript

redux

redux-observable