RxJs - Redux-Observable Navigate после выполненного действия

Question

Это скорее запрос на проверку кода, чем реальный вопрос.

У меня есть этот код ниже, который перенаправляет пользователя, если аутентификация завершена правильно, и я хотел бы знать, является ли это хорошим | правильным | оптимальнымспособ достижения этого.

Заранее спасибо.

  const loginEpic = action$ =>
  action$.pipe(
    ofType(LOGIN_USER),
    mergeMap(action =>
      ajax({
        url: `${BASE_URL}/auth/login`,
        method: "POST",
        headers: {
          "Content-Type": "application/json"
        },
        body: action.payload
      }).pipe(
        map(response => loginUserFulfilled(response)),
        takeUntil(
          action$.pipe(
            ofType(LOGIN_USER_FULFILLED),
            mapTo(history.push("/stuff"))
          )
        ),
        catchError(error =>
          of({
            type: LOGIN_USER_REJECTED,
            payload: error.xhr.response,
            error: true
          })
        )
      )
    )
  );

Answer 1

takeUntil оператор завершает наблюдаемое, как только завершается предоставленная наблюдаемая. Поскольку ajax() наблюдаемый излучает один раз, нет необходимости в takeUntil.

Перенаправление является побочным эффектом. Побочные эффекты рекомендуется выполнять в операторе tap.

Также часто имеет смысл предоставлять побочный эффект перенаправления в соответствующем эпосе:

import { tap, ignoreElements } from "rxjs/operators";

const loginEpic = action$ =>
    action$.pipe(
        ofType(LOGIN_USER),
        mergeMap(action =>
            ajax({
                url: `${BASE_URL}/auth/login`,
                method: "POST",
                headers: {
                    "Content-Type": "application/json"
                },
                body: action.payload
            }).pipe(
                map(response => loginUserFulfilled(response)),
                catchError(error =>
                    of({
                        type: LOGIN_USER_REJECTED,
                        payload: error.xhr.response,
                        error: true
                    })
                )
            )
        )
    );

const loginRedirectEpic = action$ =>
    action$.pipe(
        ofType(LOGIN_USER_FULFILLED),
        tap(() => history.push("/stuff")),
        ignoreElements(),
    );