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