Магазин Ngxs теряет состояние после нажатия клавиши F5 для обновления sh браузера - PullRequest
Новая
       5

Магазин Ngxs теряет состояние после нажатия клавиши F5 для обновления sh браузера

0 голосов
/ 12 марта 2020

Я пытаюсь сохранить состояние между ссылками на страницу sh, но кажется, что информация о состоянии теряется. Я пытаюсь сохранить два логических значения и получить его. Я установил NGXS Dev для chrome, чтобы проверить состояние. Я вижу, что действие правильно отправляет информацию о состоянии, но теряет эту информацию, когда я нажимаю F5. Чего мне не хватает?

Действие 

import { AgreementsStateModel } from '../models/agreements-state.model';

export class SetAgreementStatus {
    static readonly type = '[AGREEMENT] SetAgreementStatus';
    constructor(public payload: AgreementsStateModel) {}
}

Состояние 

 import { Action, Selector, State, StateContext } from '@ngxs/store';
    import { AgreementsStateModel } from '../models/agreements-state.model';
    import { SetAgreementStatus } from './agreement.actions';



@State<AgreementsStateModel>({
  name: 'agreementModalState',
  defaults: {
       isDeferred: false,
       isInteracted: false
  }
})
export class AgreementState {

  constructor() { }

  @Selector()
  static agreement(state: AgreementsStateModel) {
    return state;
  }

  @Action(SetAgreementStatus)
  setAgreementStatus({ patchState }: StateContext<AgreementsStateModel>, { payload }: SetAgreementStatus) {
    patchState(payload);
  }
}

Импорт AppModule 

NgxsStoragePluginModule.forRoot()

Отправка состояния 

  this.store.dispatch(new SetAgreementStatus({isInteracted: true, isDeferred: true}));

Чтение информации о состоянии 

     @Select(AgreementState.agreement) agreementModalState$: Observable<AgreementsStateModel>;

  this.agreementModalState$.subscribe(agreementModalStatus => {
      this.agreementModalStatus = agreementModalStatus;
    });

1 Ответ

1 голос
/ 12 марта 2020

Таким образом, NGRX Store не будет сохранять информацию во время обновления sh. Вы должны будете использовать пользователей localStorage или другое локальное хранилище для хранения этой информации.

Один из способов сделать это - использовать в своем редукторе ту же информацию, которую вы устанавливаете в своем магазине, в пользователи localStorage затем, когда вы обновите sh, вы можете получить любую информацию, которую вы сохранили, и заполнить свой магазин.

Существует множество библиотек, которые пытаются упростить это, например ngrx-store-localstorage , которые синхронизируют c хранилище и пользователей localStorage, поэтому вы не теряете состояние между обновлениями

, но по умолчанию хранилище ngrx не будет сохранять информацию между обновлениями страниц

...