Vuex的基本用法
1.Vuex简介
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。这是官网对于Vuex的简介。
我的大作业是一个使用Vue-cli生成的项目，按照需求，需要对很多组件之间的状态进行管理，数据交流不止限于父子组件，为了简化操作，我就选用了Vuex进行集中式的状态管理，也顺便学习一下新的东西。
下图是我的大作业在装了Vue Devtools之后，显示的某个阶段Vuex状态的截图，可见Vuex的状态在调试过程中是很容易观察的。
2.Vuex的使用
个人觉得学习Vuex最直接最有效的方法就是看Vuex的官方文档，它里面介绍了Vuex的安装以及核心概念。
Vuex的安装过程很简单，在我的项目中，我是用npm安装的。
npm install vuex --save 安装完成之后，在项目中新建store文件夹和store.js文件（也可以用别的名字）。
在store.js中，引入Vue和Vuex，然后定义store并暴露这个接口
import Vuex from 'vuex'
import Vue from 'vue'
Vue.use(Vuex)
const store = new Vuex.Store({
// 自己按需定义state，getters，mutations，actions的内容
...
})
export default store然后在main.js中引入Vuex和store，在new Vue中加入store，就可以将store实例注入到所有的子组件了。
import Vuex from 'vuex'
import store from './store/store'
Vue.use(Vuex)
new Vue({
el: '#app',
// 把 store 对象提供给 “store” 选项，这可以把 store 的实例注入所有的子组件
store,
router,
components: { App },
template: '<App/>'
}) state，getters，mutations，actions都是Vuex的核心概念，至于Module，如果项目不大，其实可以不需要。这些核心概念建议阅读官方文档。个人的理解是，你可以把state看成是所有组件的一种data，而getters可以看做是计算属性，如果不是返回一个函数，那么getters将是响应式的，mutations只能包含同步操作，只有mutation可以直接修改state，而actions可以有异步操作，所以有api请求之类的异步操作，则应该放在actions，actions可以提交mutation，也可以触发其他的action和getter。总之Vuex的结构就是和组件的内部结构有很多的相似之处。
我们可以将state看成是所有组件共用的data，在组件里，可以通过this.store.commit调用mutation，通过this.store.getters调用getters。
基础的应用还是比较简单的，安装配置之后，看文档大致就会用了。