Как я могу установить полное хранилище NGRX и затем запустить все редукторы? - PullRequest
Новая
       19

Как я могу установить полное хранилище NGRX и затем запустить все редукторы?

0 голосов
/ 29 мая 2019

Как я могу?

  1. Получить все данные хранилища NGRX
  2. Установить все данные хранилища NGRX
  3. Триггер все редукторы

Справочная информация:

У меня угловое приложение, в котором много компонентов тесно связаны с хранилищем NGRX.

I 'Мы повторно использовали эти компоненты для упрощенного макета печати некоторой информации в приложении.Я использую хром без головы, чтобы напечатать приложение в PDF.Поскольку Chrome без головы - это другой пользовательский агент, чем браузер пользователя печати, данных нет.

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

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

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

Ответы [ 2 ]

2 голосов
/ 29 мая 2019

Синхронизация вкладок браузера с использованием localStorage, NgRx и RxJS может вам в этом помочь.

Поскольку вы уже решили первую проблему:

Здесь лучше всего подходит метаредуктор: 
// set state based on local storage
export function persistStateReducer(_reducer: ActionReducer<State>) {
  const localStorageKey = '__groceries';
  return (state: State | undefined, action: Action) => {
    if (state === undefined) {
      const persisted = localStorage.getItem(localStorageKey);
      return persisted ? JSON.parse(persisted) : _reducer(state, action);
    }

    const nextState = _reducer(state, action);
    localStorage.setItem(localStorageKey, JSON.stringify(nextState));
    return nextState;
  };
}

// reset the whole state via the action's payload
export function updateStateReducer(_reducer: ActionReducer<State>) {
  return (state: State | undefined, action: Action) => {
    if (action.type === 'UPDATE_GROCERIES_STATE') {
      return (<any>action).payload.newState;
    }

    return _reducer(state, action);
  };
}
Когда вы отправляете действие, все редукторы срабатывают
0 голосов
/ 01 июня 2019

Примерно так будет:

  1. Получить весь магазин NGRX: 

    let storeData$ = store.select(rootReducers.getRootState);
let subscription = storeData$.subscribe(everything => {
    let json = JSON.stringify(everything);
    //do what you want with all of your data here
});

  2. Установить весь магазин NGRX: (мой топИнтерфейс редуктора уровня выглядит следующим образом) 

    export interface State { 
    something: topLevelReducers1.State;
    anything: topLevelReducers2.State;
    moreThings: topLevelReducers3.State;
}

    Это требует установки каждого из следующих полей верхнего уровня: 

    // here is the method //
export const dispatchSetRootState = (store:Store<State>, payload: State): void => {
    store.dispatch(new SetSomethingState(payload.something));
    store.dispatch(new SetAnythingAction(payload.anything));
    store.dispatch(new SetMoreThingsAction(payload.moreThings));
};

// here is the usage //
let everything = JSON.parse(json);
dispatchSetRootState(store, data);

// since I have a lot of combineReducers I add a short-circuit//
export function reducers(state: any, action: any): any {
    if(action.type == SomethingActionTypes.SET_SOMETHING_PROFILE) { // Sets entire object
        return Object.assign({}, state, (<PayloadAction>action).payload);
    }
    else return combinedReducers(state, action);
}

  3. Нет необходимости, так как установка в качествев # 2 запускает все действия

...