解决Vuex刷新页面数据没缓存的问题
监听页面是否刷新,如果页面刷新了,将state对象存入到sessionStroage中。页面打开之后,判断sessionStorage中是否存在state对象,如果存在,则说明页面是被刷新过,将sessionStorage中存的数据取出来,给vuex中的stage赋值,如果不存在,说明是第一次打开,则取vuex中定义的state初始值。
在App.vue中增加监听刷新事件
export default {
name: 'app',
mounted() {
//监听刷新事件
window.addEventListener('unload',this.saveState);
},
methods:{
//sessionStorage只能存入字符串,所以要先把数据转成字符串
saveState(){
sessionStorage.setItem('state',JSON.stringify(this.$store.state))
}
}
}
修改store/index.js中的state
const state = sessionStorage.getItem('state')?JSON.parse(sessionStorage.getItem('state')):{
user:{
name:''
}
}


浙公网安备 33010602011771号