使用vuex刷新后数据初始化问题的解决

原因：

由于vuex中的数据是保存在内存，所以刷新页面相当于是清除内存，vuex中保存的数据会清空。

解决方法：

1、利用localstorage缓存解决vuex数据的刷新问题

localstorage：浏览器缓存，将数据保存在本地，除非被清除，否则永久保存。

vuex的配置文件：

 state:{
   count: '',
 },
  
 mutations:{
   setCount: (state, count) => {
     localStorage.setItem('count',count);
     state.count = count;
   }
 },
 
 const getters = {
   getCount: (state) => {
     state.count = localStorage.getItem('count');
     return state.count;
   }
 }

2、使用第三方插件vuex-along插件

vuex的配置文件：

import createVuexAlong from 'vuex-along'

export default new Vuex.Store({
  state:{...},
  modules:{...},
  plugins: [createVuexAlong()]
});

这个是最基本的配置，更多具体操作请看官方文档：vuex-along插件官方文档

参考链接