Как правильно запустить перезагрузку API из редуктора / действия? - PullRequest
Новая
       39

Как правильно запустить перезагрузку API из редуктора / действия?

0 голосов
/ 09 января 2019

У меня довольно сложное приложение, которое связывается с сервером через websocket (для обновления объектов) и http (для получения исходного объекта).

Но я сталкиваюсь со следующей ситуацией:

  1. Получить из сервиса все исходные объекты
  2. Веб-сокет просит обновить объект, которого нет в списке
  3. Сделайте еще один вызов в службу для перезагрузки объектов

Так что в основном у меня это состояние: 

export const initialState: IMatchStore = {
  loading: false,
  needReload: true,
  matches: [],
};

И несколько селекторов, например: 

export const getAll = createSelector(
  matchSelector,
  ({ matches }: IMatchStore) => unflatMatches(matches),
);

export const isLoading = createSelector(
  matchSelector,
  ({ loading }: IMatchStore) => loading,
);

export const reload = createSelector(
  matchSelector,
  ({ needReload, loading }: IMatchStore) => !loading && needReload,
);

Так что, в основном, когда needReload === true, это означает, что мне нужно перезагрузить базу (это обнаруживается на редукторе, если match не существует в списке).

Мой вопрос : Как правильно обращаться с этой ситуацией? В настоящее время я делаю на службе, как: 

this.store.select(reload).pipe(filter(Boolean)).subscribe(() => this.load());

Но я чувствую, что это можно улучшить и обернуть внутри какой-нибудь effect

Обновление:

Мне удалось создать эффект, наблюдая за ActionTypes.Update, но он все еще не выглядел как надо: p 

@Effect()
login$: Observable<Action> = this.actions$.pipe(
    ofType(ActionTypes.Update),
    withLatestFrom(this.store.select(reload)),
    filter(([, needRealod]) => needRealod),
    switchMapTo(
      forkJoin( /** HTTP stuff */ ).pipe(
        map(([a, b]) => new Init(a, b)),
      ),
    ),
  );

1 Ответ

0 голосов
/ 09 января 2019

Обновленный ответ, который вы разместили, на мой взгляд, путь.

  • Это держит ваше приложение в чистоте
  • Эффект можно легко проверить

См. Начните использовать ngrx / эффекты для этого для другого примера.

...