1.什么是vuex
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
那么什么是“状态管理模式”？
让我们从一个简单的 Vue 计数应用开始
这个状态自管理应用包含以下几个部分：
- state，驱动应用的数据源；
- view，以声明方式将 state 映射到视图；
- actions，响应在 view 上的用户输入导致的状态变化。
以下是一个表示“单向数据流”理念的极简示意：
但是，当我们的应用遇到多个组件共享状态时，单向数据流的简洁性很容易被破坏：
2.vuex的使用场景
Vuex 的应用场景有什么？什么时候适合使用 Vuex，什么时候不适合使用 Vuex？
1.涉及到非父子关系的组件，例如兄弟关系、祖孙关系，甚至更远的关系；
2.他们之间如果有数据交互，那么应该使用Vuex来实现；
3.如果页面复杂度比较低的话，也可以考虑使用 global-event-bus 来实现；
4.如果只是父子关系的组件数据交互，那么应该考虑使用props进行单向传递；
5.如果涉及到子组件向父组件的数据传递，那么应该考虑使用 $emit 和 $on；
虽然 Vuex 可以帮助我们管理共享状态，但也附带了更多的概念和框架。这需要对短期和长期效益进行权衡。
如果您不打算开发大型单页应用，使用 Vuex 可能是繁琐冗余的。确实是如此——如果您的应用够简单，您最好不要使用 Vuex。一个简单的 store 模式就足够您所需了。但是，如果您需要构建一个中大型单页应用，您很可能会考虑如何更好地在组件外部管理状态，Vuex 将会成为自然而然的选择。
总而言之，假如你需要 数据 和 组件 分离，分别处理，那么使用 Vuex 是非常合适的。
3.vuex的使用
vuex 包含有五个基本的对象：
其中 mutation-types.js 是我们自己添加的待会会详细介绍其作用
state：存储状态。也就是变量；
Vuex 使用单一状态树——是的，用一个对象就包含了全部的应用层级状态。至此它便作为一个“唯一数据源 (SSOT)”而存在。这也意味着，每个应用将仅仅包含一个 store 实例。单一状态树让我们能够直接地定位任一特定的状态片段，在调试的过程中也能轻易地取得整个当前应用状态的快照。
单状态树和模块化并不冲突——在后面的章节里我们会讨论如何将状态和状态变更事件分布到各个子模块中。
getters：派生状态。也就是set、get中的get，有两个可选参数：state、getters分别可以获取state中的变量和其他的getters。外部调用方式：store.getters.personInfo()。就和vue的computed差不多；
mutations：提交状态修改。也就是set、get中的set，这是vuex中唯一修改state的方式，但不支持异步操作。第一个参数默认是state。外部调用方式：store.commit('SET_AGE', 18)。和vue中的methods类似。
actions：和mutations类似。不过actions支持异步操作。第一个参数默认是和store具有相同参数属性的对象。外部调用方式：store.dispatch('nameAsyn')。
modules：store的子模块，内容就相当于是store的一个实例。调用方式和前面介绍的相似，只是要加上当前子模块名，如：store.a.getters.xxx()。
最后将store实例挂载到main.js里面的vue上去就行了
在vue组件中使用时，我们通常会使用mapGetters、mapActions、mapMutations，然后就可以按照vue调用methods和computed的方式去调用这些变量或函数，示例如下：
最后我们来讲为啥 创建了一个mutation-type.js文件
为了多人开发 方便管理,想一下，一大堆的功能模块混合在一起 不符合模块化的思想