解决vuex页面刷新导致数据失落问题
vuex数据是存在内存当中，当页面刷新之后vuex数据天然会失落。咱们有两种办法解决该问题:
1.应用vuex-along
2.应用localStorage或者sessionStroage
1.应用vuex-along
vuex-along的本质也是将vuex中的数据寄存到localStorage或者sessionStroage中，只不过这个存取过程这个组件会帮咱们实现,咱们只须要用vuex的读取数据形式操作就能够了,简略理解一下vuex-along的应用办法。
装置vuex-along:
npm install vuex-along --save配置vuex-along: 在store/index.js 中最初增加以下代码:
plugins: [VueXAlong({ name: 'store', //寄存在localStroage或者sessionStroage 中的名字 local: false, //是否寄存在local中 false 不寄存 如果寄存依照上面session的配置 session: { list: [], isFilter: true } //如果值不为false 那么能够传递对象 其中 当isFilter设置为true时， list 数组中的值就会被过滤调,这些值不会寄存在seesion或者local中})]2.应用localStorage或者sessionStroage
created() { //在页面加载时读取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)); });},下面两种办法都能够解决vuex页面刷新导致数据失落问题。依照下面的办法配置之后就能够失常应用vuex了，页面刷新数据也不会失落了。