Что хранить в ngrx / store при использовании angularfire2?

Я начинаю изучать angular2 и пошел ва-банк с ngrx/store (у меня нет предыдущего exp с redux) и firebase app. Теперь я не могу понять, как хранить объекты firebase, массивы и прочее в магазине. Должен ли я положить их так, как есть, например, положить этот FirebaseListObservable в магазин af.database.list('/items')? Это выглядит как хорошая подгонка (компонент мог бы просто сделать магазин.select ('items') и template могли бы подписаться на это, и для мутаций я все еще могу запускать события в магазин, где я бы мутировал список с помощью но я думаю, что это не потому, что этот список может быть изменен из-за пределов магазина (какой-то другой пользователь приложения, который подписывается на тот же список). Или это должно зависеть от конкретного случая?



Если нет, то где я должен хранить ссылку на этот объект firebase и что я должен поместить в хранилище вместо этого?

621   1  

1 ответ:

Это рекомендуемые, которая должна быть положена в магазине только содержание сериализуемые:

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

Асинхронная природа angularfire2 observables означает, что вы, вероятно, захотите интегрировать их с помощью @ngrx/effects. Эффекты, по существу, прослушивают определенное действие, выполняют некоторый (возможно, асинхронный) побочный эффект и затем (обычно) производят другое действие.

Как вы это сделаете, будет зависеть от того, что именно вы хотите сделать.

Например, если вы хотите использовать FirebaseListObservable для выполнения запросов, вы можете использовать типичный READ_ITEMS, READ_ITEMS_SUCCESS и READ_ITEMS_ERROR действия и эффект, как это: 

@Effect()
readItems$ = this.actions$
  .ofType('READ_ITEMS')
  .switchMap(() => this.af.database
    .list('/items')
    .first()
    .map(items => ({ type: 'READ_ITEMS_SUCCESS', payload: items }))
    .catch(() => Observable.of({ type: 'READ_ITEMS_ERROR', payload: error.toString() }))
  );

Однако, если вы хотите слушать изменения в реальном времени из FirebaseListObservable, Вы можете сделать что-то вроде этого: 

@Effect()
refreshItems$ = this.af.auth
  .switchMap((authState) => authState ?
    this.af.database
      .list('/items')
      .map(items => ({ type: 'REFRESH_ITEMS', payload: items })) :
    Observable.of({ type: 'REFRESH_ITEMS', payload: [] })
  );
Обратите внимание, что второй эффект не прислушивается к действию. Вместо этого он реагирует на состояние аутентификации и будет выдавать действия REFRESH_ITEMS после аутентификации пользователя и т. д.

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

5  
2017-03-27 02:41:05

Comments

    Ничего не найдено.
Click here to cancel reply.