RxJS Redux可观察的Epic改进

时间:2019-09-04 03:20:45

标签: rxjs redux-observable

我有以下Redux可观察到的Epic,它使用了https://aws-amplify.github.io/docs/js/authentication#retrieve-current-session处来自AWS Amplify的异步Auth.currentSession

所以我基本上有两个异步函数需要调用,实际的GraphQL突变排在第二位。

我对RxJS和函数式编程还是不熟悉,所以我想知道这是否是处理此问题的最有效方法。 catchError似乎是重复的,嵌套似乎是多余的,但是我喜欢它如何使知道哪个函数有问题。

预先感谢您提供改进此代码的任何建议。

const postEpic = (action$, state$) =>
  action$.pipe(
    ofType(actionTypes.CREATE_POST),
    mergeMap(action => {
      return from(Auth.currentSession()).pipe(
        switchMap(user => {
          return from(
            client.mutate({
              mutation: gql(createPost),
              variables: {
                createPostInput: {
                  User_id: user.getIdToken().payload.id,
                  title: action.payload.title
                }
              }
            })
          ).pipe(
            map(response => createPostSuccess()),
            catchError(error => of(createPostError(error)))
          );
        }),
        catchError(error => of(createPostError(error)))
      );
    })
  );

1 个答案:

答案 0 :(得分:0)

总体看起来不错。我稍微参考一下代码以减少复杂性和嵌套。我更喜欢重复热观测,而不是嵌套捕获。 catchError完成了可观察性,因此如果在原始代码中失败,则在外部流中将您的流停止,这可能是唯一的问题。

const postEpic = (action$, state$) =>
  action$.pipe(
    ofType(actionTypes.CREATE_POST),
    mergeMap(action => from(Auth.currentSession()),user=>[user,action.payload.title]),
    switchMap(([user,title]) =>client.mutate({
        mutation: gql(createPost),
        variables: {
          createPostInput: {
            User_id: user.getIdToken().payload.id,
            title
          }
        }
      })),
    map(response => createPostSuccess()),
    catchError(error => of(createPostError(error))),
    repeat()
  );