RxJs-操作完成后,Redux可观察的导航

时间:2019-09-30 18:17:17

标签: rxjs navigation redux-observable

这不是实际的问题,更多是代码检查请求。

下面我有这段代码,如果身份验证正确完成,该用户将重定向用户,我想知道这是否是实现此目标的好方法。

谢谢。

  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
          })
        )
      )
    )
  );

1 个答案:

答案 0 :(得分:0)

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(),
    );