Question

我正在开发一个处理事件注册的react / redux应用程序，并且必须开发一个史诗般的游戏来吸引用户参加不同的事件。

当前有一个史诗般的文件处理检查可用座位的过程，我需要在运行“注册”功能之前立即执行此操作。

因此，我尝试实现一个可实现以下目的的史诗：

 - Upon recieving an enrolInEvent.request it is going to then
 - Dispatch checkAvailableSeats.request action
 - Wait for checkAvailableSeats.success action
 - Run the 'enrol' async function
 - Dispatch checkAvailableSeats.request again
 - When it gets the checkAvailableSeats.success it is then mapped to enrolInEvent.success

这是我构建的代码，但是我似乎找不到找到在Epic中间分发“ checkAvailableSeats.request”的方法。发生了什么事，enrolInEvent.request已被调度，但是在redux-logger中没有新动作弹出。

// tl;dr:
// enrolInEvent.request -> checkAvailableSeats -> enrol -> checkAvailableSeats again -> enrolInEvent.success

export const enrolInEventEpic: EventMetadataEpic =
  (action$, state$, { eventService }) =>
    action$.pipe(
      filter(isActionOf(enrolInEvent.request)),
      map(checkAvailableSeats.request), // I would need to dispatch this
      switchMap(() =>
        action$.pipe(  // Then scan the action observable for a success response
          filter(isActionOf(checkAvailableSeats.success)),
          take(1),
          switchMap(() =>
            from(eventService.enrolInCurrentEvent(
              state$.value.eventForm.eventStatus,
              state$.value.infrastructure.pageId,
            ))
            .pipe(
              map(checkAvailableSeats.request), // And dispatch here again
              switchMap(() =>
                action$.pipe(
                  filter(isActionOf(checkAvailableSeats.success)),
                  take(1),
                  map(checkStatus => enrolInEvent.success(checkStatus.payload)),
                  catchError((message: string) => of(enrolInEvent.failure(message))),
                )
              )
            )
          )
        )
      )
    );

我给人的印象是，映射到史诗中间的某个动作会调度它，但这似乎是不正确的。使用redux-observable实现我所需行为的最简单方法是什么？

Answer 1

调度动作的唯一时间是史诗本身返回这些动作的时间，因此map(checkAvailableSeats.request)不会像您期望的那样起作用，除非它是史诗的最后一部分。

我不确定您为什么需要两次checkAvailableSeats，但我看到的两个选项是：

1）内联checkAvailableSeats.request的XHR逻辑，也许使用Ajax Observable。这样，您不必调度中间的Redux操作

2）拆分史诗（enrolInEventEpic），以便从单独的史诗中调度所有动作，并通过区分动作有效负载来控制两个请求/成功对中的哪个正在执行

有没有办法在Redux可观察的史诗中调度动作？

1 个答案: