vuex持久化

1、使用场景 vuex刷新之后数据会消失
2、使用方法
（1）结构1

点击查看代码

import { createStore } from "vuex"
import state from './state'
import mutations from './mutations'
import actions from './actions'
import * as getters from './getters'
import persistedState from 'vuex-persistedstate' // vuex持久化插件

const Store = createStore({
  state,
  mutations,
  actions,
  getters,
  plugins: [persistedState({
    storage: window.sessionStorage,
    reducer: (val) =>{ 
	// 存储state中的userInfo
      return { userInfo: val['userInfo']} }
  })],
})

export default Store

（2）结构2

点击查看代码

import Vue from 'vue'
import Vuex from 'vuex'
import getters from './getters'
import app from './modules/app'
import settings from './modules/settings'
import user from './modules/user'
import persistedState from 'vuex-persistedstate' // vuex持久化插件

Vue.use(Vuex)

const store = new Vuex.Store({
  modules: {
    app,
    settings,
    user
  },
  getters,
  plugins: [persistedState({
    storage: window.sessionStorage,
    key:"vuex" // app sttings user 都存在session中了
  })],
})

export default store