Отправка различных типов действий из эффекта в ngrx при использовании создателей действий - PullRequest
0 голосов
/ 02 апреля 2020

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

 onManageTab$ = createEffect(() =>
    this.actions$.pipe(
      ofType(TabsActions.manageTab),

      // The idea to go with switchMaps and forkjoins over withLatestFrom is
      // `withLatestFrom` fetches undefined state here (think store is not properly created at that point)

      switchMap(action =>
        forkJoin(
          of(action),
          this.store.select(TabSelectors.getAllTabsInfo).pipe(take(1))
        )
      ),
      switchMap( ([action, tabsInfo]) => { 

        if (someCond) {
          return [  TabsActions.addTab({  payload: {pageInfo: action.payload.pageInfo} })];
        }
        return [TabsActions.updateActiveTab({  payload: {pageID: existingTabID} })];

        // some workaround to make it work
        return of({
          type: '[Tab] Dummy action',
        });
      })
    )
  );

Я столкнулся с проблемой получения последнего значения из магазина с использованием withLatestFrom, поэтому мне удалось получить его с помощью switchMap и передать действие и некоторую tabInfo другому switchMap. Теперь я хочу отправить другое действие в зависимости от условий. (Примечание: я создал свой редуктор и действия с дополнительной payload опорой, я обработал ее соответственно)

Я получаю следующую ошибку, если уберу возврат фиктивного действия ('[Tab] Dummy action')

Type 'Observable<{}>' is not assignable to type 'Observable<Action>'.
    Property 'type' is missing in type '{}' but required in type 'Action'.

Argument of type 
'([action, tabsInfo]: [{ payload: { pageInfo: PageInfo; }; } & TypedAction<"[Tab] Manage tab">, PageInfo[]]) => Observable<{ type: string; payload: { pageInfo: PageInfo; }; }> | Observable<{ type: string; payload: { ...; }; }>' 
is not assignable to parameter of type 
'(value: [{ payload: { pageInfo: PageInfo; }; } & TypedAction<"[Tab] Manage tab">, PageInfo[]], index: number) => ObservableInput<{ type: string; payload: { pageInfo: PageInfo; }; }>'.

Я понимаю, что это выдает ошибку, потому что моя полезная нагрузка в действиях отличается. Но нельзя ли отправлять действия с разными полезными нагрузками на основе условия.

Почему это работает, если у меня есть действие без полезной нагрузки в качестве возврата?

Пожалуйста, дайте Я знаю, если вы хотите узнать полную трассировку ошибок, чтобы иметь больше понимания

Редактировать : Ниже описано, как я создал действия

export const addTab = createAction(
  '[Tab] Add tab',
  props<{ payload: { pageInfo: PageInfo } }>()
);

export const updateActiveTab = createAction(
  '[Tab] Update active tab',
  props<{ payload: { pageID: string } }>()
);

1 Ответ

0 голосов
/ 10 апреля 2020

Я нашел обходной путь для моей проблемы. Я пытался написать 2 эффекта, которые либо возвращают [Action] или EMPTY

 onManageTabCondTrue$ = createEffect(() =>
    this.actions$.pipe(
      ofType(TabsActions.manageTab),
      switchMap(action =>
        forkJoin(
          of(action),
          this.store.select(TabSelectors.getAllTabsInfo).pipe(take(1))
        )
      ),
      switchMap( ([action, tabsInfo]) => { 

        if (someCond) {
          return [  TabsActions.addTab({  payload: {pageInfo: action.payload.pageInfo} })];
        }
        return EMPTY;
      })
    )
  );

 onManageTabCondFalse$ = createEffect(() =>
    this.actions$.pipe(
      ofType(TabsActions.manageTab),
      switchMap(action =>
        forkJoin(
          of(action),
          this.store.select(TabSelectors.getAllTabsInfo).pipe(take(1))
        )
      ),
      switchMap( ([action, tabsInfo]) => { 

        if (!someCond) {
           return [TabsActions.updateActiveTab({  payload: {pageID: existingTabID} })];
        }
        return EMPTY;
      })
    )
  );

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

...