vuex 入门及持久化

vuex是什么？官方是这么定义的    

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。

个人理解就是vuex是vue的一个小型状态管理仓库，可以跨页面操作其他页面的数据状态。

基于vue-cli

安装

下载vuex，npm install vuex --sava。这里为什么要加save因为vuex不光在开发使用在生产环境也需要使用。

新建文件夹vuex，在vuex下面创建store.js文件，写入代码

引入

其他页面拿到vuex里面的数据

这里注意的是引入vuex的时候必须加一个{}，不然会报错。

其他页面修改vuex的数据

vuex持久化

思路

vuex也是js，所以在客户端，页面刷新后数据就丢失了，有时候我们希望数据一直都在，这样我们就需要用到常用的常用的存储工具localStory，思路就是每次数据发生改变的时候就存入一下localStory，然后初始化的时候读取一下localStory就可以了。

实现

这里只是简单的介绍了一下vuex的使用，如果想深入学习可以点击Introduction · Vuex官方文档学习。