vuex——中央状态管理架构
关于Vuex，官网给出的解释是
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
纳尼！什么叫状态应用管理模式,不着急，听我娓娓道来
注意注释的几个部分state、view、actions
我个人就简单地理解为:vue模板当中不是分为块吗。template、script、style，view这块的话应该指的就是template相关的代码，展示整个视图。而state就是script中的data部分，与数据打交道，actions就是script中的methods部分，通常是方法（个人理解），官方的解释更为权威。
话说vuex的核心就是store（仓库），它包含着应用中的大部分状态。当组件从store中读取状态时，若组件中的状态发生变化的话，那么组件的状态也会得到更新；我们不能直接修改store中的状态，如果要修改的话，是通过组件中的提交 (commit) mutation（变化）。来看个例子
首先在你vue项目中安装vuex cnpm install vuex --save
然后在你的项目中创建store文件，创建一个store.js,如图所示
在main.js中引入vuex，注册并且实例化
更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件：每个 mutation 都有一个字符串的事件类型 (type)和 一个回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数
Vuex总共有几个核心 vuex官方文档 我相信很多人跟我一样，看官方文档都是一脸懵的
这种做法呢只要根组件里面引入子组件并且在子组件上bind数据
我们使用vuex不这么做（记得使用vuex之前在你的项目中安装vuex，cnpm install vuex --save，在src文件里面创建store文件夹并且创建store.js，在store.js里面引入vue和vuex，使用并且实例化vuex，当然也要记得在入口文件main.js里面引入vuex，这是基本的准备工作）
state
ok，那么应该怎么在productlistOne里面使用呢
直接就是this.$store.state.products
还记得我们在根组件的写过那句v-bind吗，这个可以直接删掉
数据都被带了出来
这就是state，我个人的理解就是一个集中管理数据的仓库
getters
现在我们要对里面的数据进行操作，比如说对加组件1和组件2里面的数据都要进行打折。我们可以使用getters
在组件1和组件2里面使用
this.$store.getters.saleProducts意为获取store下的getters的Products函数，听起来好像是一个公用的函数
这是都是得到store里面的数据，那么我们要想改变里面的数据，应该怎么做。其实开篇有提到过，就是提交mutation。每个mutation都有一个事件类型（type）和一个回调函数（handler）
mutation
在学习mutation的时候，我将自己开发工具换成了Visual Studio Code，感觉这个比较好用
在store.js中写了一个mutations，里面有个reduceprice的方法
那么如何写producListOne中使用呢
就是在方法中使用this.$store.commit
你不能直接调用一个 mutation handler。要唤醒一个 mutation handler，你需要以相应的 type 调用store.commit方法：
值得一提的是，我在producListTwo里面没有定义reduceprice，但是里面的内容也同样得到改变，想必这就vuex的好处，使用同一个库
actions
Action 类似于 mutation，不同在于：
Action 提交的是 mutation，而不是直接变更状态。
Action 可以包含任意异步操作。
Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象，因此你可以调用context.commit提交一个 mutation
具体说payload是通过dispatch传过来的值
Actions 支持同样的载荷方式和对象方式进行分发
...mapGetters和...mapActios是es6的语法，自己的项目中npm -preset-stage-2 --save
