vuex持久化存储插件

一.使用js

 1.plugin文件夹定义

.

export default store => {
  if (localStorage.state) store.replaceState(JSON.parse(localStorage.state))
  // 每次执行mutation时都会执行当前的回调函数
  store.subscribe((mutation, state) => {
    localStorage.state = JSON.stringify(state)
  })
}

2.在index.js里使用 

 

 

二.vue使用插件

用法见文档https://www.npmjs.com/package/vuex-persist

cnpm install vuex-persist --save

import Vue from 'vue'
import Vuex from 'vuex'
import VuexPersistence from 'vuex-persist'

import permission from './modules/permission'
import user from './modules/user'
import menu from './modules/menu'
import role from './modules/role'
import parking from './modules/parking'
import rule from './modules/rule'
import dialog from './modules/dialog'
import getters from './getters'

Vue.use(Vuex)
const vuexLocal = new VuexPersistence({
  storage: window.sessionStorage,
  modules: ['user', 'role', 'parking']
})

let store = new Vuex.Store({
  plugins: [vuexLocal.plugin],
  modules: {
    user,
    permission,
    menu,
    role,
    parking,
    rule,
    dialog
  },
  getters
})

export default store