name: 'App',
 mounted () {
 window.addEventListener('unload', this.saveState)
 },
 methods: {
 saveState () {
  sessionStorage.setItem('state', JSON.stringify(this.$store.state))
 }
 }

 window.addEventListener("load", () => {
  sessionStorage.clear();
 });

var state = sessionStorage.getItem('state') "htmlcode">

import Vue from 'vue'
import Vuex from 'vuex'
import state from './states'
import mutations from './mutations'
import getters from './getters'
import actions from './actions'
Vue.use(Vuex)
export default new Vuex.Store({
 state,
 mutations,
 getters,
 actions
})


mutations.js:


import {
 SOME_MUTATION
} from './mutation-types.js'
 
export default {
 [SOME_MUTATION] (state) {
 state.count++
 }
}


mutation-types.js

export const SOME_MUTATION = 'SOME_MUTATION'

补充知识：vuex-along有效防止刷新页面后vuex中的数据重置
1.vuex-along安装

npm i vuex-along --save

2.在store目录下的index.js文件中引入
2.1

import {createVuexAlong} from 'vuex-along'

2.2直接上图

简单说明其中的含义：

name：“”“”

//在这块我存入的是localstorage，代表localstorage的键值

local：{list:["userInfo"],isFilter:true}

//list:要过滤的vuex中的数据，isFilter代表将userInfo滤过，其余存进localstorage

session：false

//对于sessionstorage不进行任何操作


更加详细信息借助github进行了解：https://github.com/boenfu/vuex-along
3.以上这篇解决vuex刷新数据消失问题就是小编分享给大家的全部内容了，希望对各位将来的大佬有所帮助！也希望大家多多支持。