我们在使用vue开发项目的时候，通常会用到它专门的状态管理工具——vuex。但是vuex中store中的数据有一个特点，就是当页面刷新时，vue实例会重新加载，store中的数据会被重新赋值，这样会造成数据丢失。为此，我们可以通过js存储技术来解决，这里使用sessionStorage比较合适。之所以适合sessionStorage，是因为在sessionStorage持续时间内打开当前页面时，一旦页面关闭，会立即失效。下次打开页面进来，还是新的数据，不是上次存储的数据。在我们的APP.vue中添加如下代码实现相应的功能：//页面加载时读取sessionStorage中的状态信息if(sessionStorage.getItem('store')){this.$store.replaceState(Object.assign({},this.$store.state,JSON.parse(sessionStorage.getItem('store'))))}//页面刷新时将vuex中的信息保存到sessionStorage中window.addEventListener('beforeunload',()=>{sessionStorage.setItem('store',JSON.stringify(this.$store.state))})
