1、代码 保存
在 app 页面编写
export default function(ctx){ // 离开页面 window.addEventListener('beforeunload', ()=> { console.log('触发离开事件') sessionStorage.setItem("store",JSON.stringify(ctx.store.state)) }); // 页面加载完成 window.addEventListener('load', ()=> { console.log('触发加载完成事件') let storeCache = sessionStorage.getItem("store") if(storeCache != null&&storeCache != undefined&& storeCache!= ''){ // 普通的state属性高更改的话需要用mutations ，但是如果你修改的是state 根属性的时候，那么 // 就要使用replaceState 方法了。 ctx.store.replaceState(JSON.parse(storeCache)); } }); }
2. 采用插件// vuex-persist
import Vuex from 'vuex'
import Vue from 'vue'
import VuexPersistence from 'vuex-persist'// vux 状态缓存插件
// vuex-persist
const vuexLocal = new VuexPersistence({
storage: window.localStorage
})
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
isLogin: false
},
mutations: {
changeLoginStatus (state, params) {
state.isLogin = params
}
},
actions: {
},
modules: {
},
plugins: [vuexLocal.plugin]
})
export default store
