VueX数据持久化

解决：Vue刷新时获取不到数据

解决方案：1.本地存储 2.Vuex数据持久化工具插件

本地存储

import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
    state:{
      count:sessionStroage.getItem('da')
    },
    mutations{
      eventStroage(state){
    	sessionStorage.setItem('da',state.count)		
      }
    },
   ......
})

//组件中使用

  <div class="home">
    {{$store.state.count}}
    <!-- 绑定一个方法 -->
    <button @click="$store.commit('eventStroage')">加一</button>
  </div>
</template>

vuex-persist插件

(1)项目安装：
    npm install vuex-persist -s
(2)main.js引入：
	import VuexPersistence from "vuex-persist"
(3)创建持久化存储对象；
	var vueLocal=new VuexPersistence({
            // storage 存储方式  默认的是localStorage存储，可以修改成会话存储（window.sessionStorage）
  	    storage:window.localStorage
    })
(4)store中定义
export default new Vuex.Store({
    state:{...},
    mutations:{...},
    actions: { ... },
    plugins: [vueLocal.plugin]
})