Vuex

Vuex是Vue中的状态管理工具，当多个组件(这些组件并不是父子关系)需要共享一些数据时，就可以把这些数据存储在Vuex中

安装：npm install vuex --save
基本使用（关键代码）：

小节：
1、提取出一个公共的store对象，用于保存在多个组件中共享的状态
2、通过this.$store.属性的方式来访问状态；通过this.$store.commit('mutations中的方法')来修改状态

 

Vuex的5个核心概念：state、mutations、getters、actions、modules
Getters使用：有两种参数形式

 

Mutations使用：
在通过mutations提交数据时，我们也可以携带一些参数，这里的参数被称为载荷(Payload)

以上代码这种特殊的提交方式，Mutation的处理方式是将整个commit的对象作为payload使用

注：Vuex中最初state中放入的属于都被响应式系统管理起来，如果后续向往里面添加或删除响应式数据，则：
添加：Vue.set(对象,属性,属性值)
删除：Vue.delete(对象,属性)

 

Actions的使用：
通常情况下，Vuex要求我们Mutaions中的方法必须是同步方法，主要原因是当我们使用devtools时，其可以帮助我们捕捉mutaion的快照；但如果是异步操作，该工具将不能很好的追踪操作的完成

actions中的方法一般处理异步请求，但结果还需commit至mutations中的方法，借助mutaions中的方法完成视图的更新

 

Modules的使用：
Vue使用单一状态树，那么也意味着很多状态都会交给Vuex来管理，当应用病的非常复杂时，store对象就有可能变得相当臃肿。为了解决这个问题，Vuex允许我们将store分割成多个模块，每个模块又拥有自己的state,mutaions,actions,getters,modules