将 @Effect 转换为 createEffect NGRX

Question

我正在将 @Effect（显然现在已弃用）转换为 createEffect，但是我看到了一些我没有预料到的错误并且不明白为什么。

上一个效果：

  @Effect({ dispatch: false })
  LoginSuccess: Observable<any> = this.actions.pipe(
    ofType(AuthActions.SUCCESSFUL_LOGIN),
    tap((user) => {
      localStorage.setItem('jwt', user.payload.token);
      this.router.navigateByUrl('/');
    })
  );

新效果：

  loginSuccess$ = createEffect(() => {
    return this.actions.pipe(
      ofType(AuthActions.SUCCESSFUL_LOGIN),
      tap((user) => {
        localStorage.setItem('jwt', user.payload.token);
        this.router.navigateByUrl('/');
      })
    ),
    { dispatch: false }
  });

错误：

“从不”类型上不存在属性“有效负载”。

类型参数 '() => { dispatch: boolean; }' 不能分配给 '() => EffectResult' 类型的参数。

任何人都可以指出我明显的错误，我将不胜感激。

Answer 1

将从createAction返回的实际actionCreator传入ofType，即：

export const successfulLoginAction = createAction('[User] Login Succeeded', props<{ token: string }>());

    return this.actions.pipe(
      ofType(successfulLoginAction),
      tap((action) => {
          localStorage.setItem('jwt', action.token);
      ...

如果你想使用老式的动作类，那么你需要将动作类型传递给ofType：

    return this.actions$.pipe(
      ofType<LoginSuccess>(AuthActions.SUCCESSFUL_LOGIN),
      tap((action) => {
        localStorage.setItem('jwt', action.payload.token);
      ...
  );