会话存储和ngrx存储与功能模块之间的同步

时间:2019-08-14 08:23:00

标签: angular ngrx

我正在使用ngrx-store-localstorage npm软件包将我的ngrx存储与浏览器会话存储同步。 我已使用功能存储区将存储区划分为多个块 直到刷新浏览器,同步过程才能完美进行;刷新浏览器时,将重新创建存储,即使会话存储中所有其他功能存储均可用,也仅会构建当前功能存储并将其与会话存储同步。 是否有任何设置可用于将整个会话存储同步到商店?

2 个答案:

答案 0 :(得分:0)

只需将存储:sessionStorage属性添加到LocalStorageConfig

答案 1 :(得分:0)

NGRX允许您创建中间件Document

开发人员可以将meta-reducers看作是action-> reducer管道的钩子。元归约器使开发人员可以在调用常规归约器之前对操作进行预处理。

import merge from 'lodash.merge';
import { StoreModule, ActionReducer, MetaReducer } from '@ngrx/store';
import { reducers } from './reducers';
 
export function storageMetaReducer<S, A extends Action = Action>(reducer: ActionReducer<S, A>) {
      return function(state: S, action: A): S {
        const nextState = reducer(state, action);
        const savedState = JSON.parse(localStorage.getItem('__storage__')) || {};
        merge(nextState, savedState);
        localStorage.setItem('__storage__', nextState)
        return nextState;
      };
    }
    
export const metaReducers: MetaReducer<any>[] = [storageMetaReducer];

@NgModule({
  imports: [
    StoreModule.forRoot(reducers, { metaReducers })
  ],
})

localStorage与sessionStorage之间的主要区别

localStorage在选项卡之间是持久的,sessionStorage在每个选项卡之间。