Question

在NGRX效果中，我无法获得两个要按顺序执行的动作。

Here are the effects

registerFinishSave$ = createEffect(
        () => this.actions$.pipe(
            ofType(registerFinishSave),
            withLatestFrom(
                this.store.select(selectRouteState),
                (action, state) => ({
                    firstName: action.request.firstName,
                    id: state.queryParams.id,
                    lastName: action.request.lastName,
                    password: action.request.password,
                    repeatPassword: action.request.repeatPassword,
                    token: state.queryParams.token,
                    userName: action.request.userName
                })),
            switchMap((request) =>
                this.accountService.updateAndVerifyAccount(request).pipe(
                    mergeMap((response: any) => from([registerFinishSaveSuccess({ response }), loginSuccess({response})])),
                    // map((response: any) => registerFinishSaveSuccess({ response })),
                    catchError((response: HttpErrorResponse) => {
                        if (response.status === 400) {
                            return of(registerFinishSaveFailure({ response }));
                        }
                        throw response;
                    })
                )
            )
        )
    );

registerFinishSaveSuccess$ = createEffect(
        () => this.actions$.pipe(
            ofType(registerFinishSaveSuccess),
            tap(({ response }) => {
                console.log('registerFinishSaveSuccess ');
                // this.router.navigate(['/']);
                this.notificationService.info(response.message);
            })
        ), {
            dispatch: false
        }
    );

loginSuccess$ = createEffect(
    () => this.actions$.pipe(
      ofType(loginSuccess),
      tap(() => {
        console.log('loginSuccess ');
        return this.router.navigate(['/']);
      })
    ), {
      dispatch: false
    }
  );

Here are the reducers

  on<AuthenticationState>(loginSuccess, (state: AuthenticationState, { response }) => ({
    ...state, accessToken: response.accessToken, displayName: response.displayName, id: response.id, isAuthenticated: true, refreshToken: response.refreshToken
  })),

on<AccountState>(registerFinishSaveSuccess, (state: AccountState, { response }) => ({
        ...state, message: null
    })),

registerFinishSaveSuccess的作用和效果似乎起作用。减速器似乎设置了动作loginSuccess的状态。但是，效果loginSuccess似乎没有触发。

我需要依次触发registerFinishSaveSuccess和loginSuccess动作及其效果。不确定下面的代码是否正确

''' mergeMap（（response：any）=> from（[[registerFinishSaveSuccess（{response}），loginSuccess（{response}）]）））， '''

Answer 1

无需在mergeMap中分派两者。您可以调度registerFinishSaveSuccess，然后将触发他的效果。在registerFinishSaveSuccess效果中，您可以分派loginSuccess，这样就可以确保保留订单。

生效时分派动作

1 个答案: