在nuxt使用vueX代替storage的实现方案

//经典模式
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = () => new Vuex.Store({
  state: {
    counter: 0
  },
  mutations: {
    addCounter(state) {
      state.counter++
    }
  }
})
export default store

//新版示例
export  const state = () => ({
	userInfo: null,
	token: null,
})
export const getters = {
  getToken(state){
    return state.token
  },
}
export const mutations = {
  set_userInfo(state, userInfo) {
      state.userInfo = userInfo;
  },
  set_token(state, token) {
      state.token = token;
  },
}
export const actions = {
	//do ajax
}

this.$store.state.token;
this.$store.commit('set_token',token);

//离开页面 刷新前 将store中的数据存到session
    window.addEventListener('beforeunload', ()=> {
        sessionStorage.setItem("storeCache",JSON.stringify(ctx.store.state))
    });
    //页面加载完成  将session中的store数据
    // window.addEventListener('load', ()=> {
        let storeCache = sessionStorage.getItem("storeCache")
        if(storeCache){
            // 将session中的store数据替换到store中
            ctx.store.replaceState(JSON.parse(storeCache));
        }
    // });

export default ( ctx ) => {
	let toU;
	ctx.app.router.afterEach((to, from) => {
		toU = to;
	})
	if(toU){
		sessionStorage.setItem("storeCache",JSON.stringify(ctx.store.state))
	}
	let storeCache = sessionStorage.getItem("storeCache")
	if(storeCache){
		// 将session中的store数据替换到store中
		ctx.store.replaceState(JSON.parse(storeCache));
	}
}