刷新不清除状态管理、刷新不清楚指定数据的状态管理

刷新不清除所有状态管理器:

下载依赖:vuex-persistedstate

mport Vue from 'vue';
import Vuex from 'vuex';
import getters from './getters';
import user from './modules/user';
import permission from './modules/permission';
import filterbox from './modules/filterbox';
import createPersistedState from 'vuex-persistedstate';

Vue.use(Vuex);

const store = new Vuex.Store({
  plugins: [createPersistedState()],
  getters,
  state: {
    maptype: '2d',
  },
  modules: {
    user,
    permission,
    filterbox
  }
});

export default store;

刷新不清除指定状态管理器:

import Vue from 'vue';
import Vuex from 'vuex';
import getters from './getters';
import user from './modules/user';
import permission from './modules/permission';
import filterbox from './modules/filterbox';
import videoList from './modules/videoList';
import conponentAttrConfig from './modules/componentAttrConfig';
import CreatePersistedState from 'vuex-persistedstate';

Vue.use(Vuex);

const state = {
  maptype: '2d' 
}

// 需要持久化的数据放到reducer里
const vuexPersisted = new CreatePersistedState({
  key: 'VuexPersisted',
  storage: window.sessionStorage,
  reducer(val) {
    return {
      maptype: val.maptype,
      permission: {
        addRoutes: val.permission.addRoutes
      }, 
      user: {
        change: val.user.change,
        isHome: val.user.isHome,
        treeInfo: val.user.treeInfo,
        sidebarMenuList: val.user.sidebarMenuList
      }  
    }
  } 
})

const store = new Vuex.Store({
  modules: {
    user,
    permission,
    videoList,
    filterbox,
    conponentAttrConfig
  },
  state,
  getters,
  plugins: [vuexPersisted]
});

export default store;
原文地址:https://www.cnblogs.com/hy96/p/13521952.html