Vuex.

Vuex

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。

它采用 集中式存储管理 应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

单界面的状态管理

State：不用多说，就是我们的状态。

View：视图层，可以针对State的变化，显示不同的信息。

Actions：这里的Actions主要是用户的各种操作：点击、输入等等，会导致状态的改变。

挂载到Vue实例中

1.让所有的Vue组件都可以使用这个store对象
2.来到main.js文件，导入store对象，并且放在new Vue中
3.，在其他Vue组件中，我们就可以通过this.$store的方式，获取到这个store对象了

Vuex核心概念

Vuex有几个比较核心的概念:

◼ State => data
◼ Getters => computed
◼ Mutation => methods
◼ Action => 异步操作
◼ Module => 模块化

Mutation状态更新

Vuex的store状态的更新唯一方式：提交Mutation
◼ Mutation主要包括两部分：
◼ 字符串的事件类型（type）
◼ 一个回调函数（handler）,该回调函数的第一个参数就是state。 ◼ mutation的定义方式：
◼ 通过mutation更新

Mutation传递参数

在通过mutation更新数据的时候, 有可能我们希望携带一些额外的参数

参数被称为是mutation的载荷(Payload)

Action

Action类似于Mutation, 但是是用来代替Mutation进行异步操作的.

context

◼ context是和store对象具有相同方法和属性的对象.

◼ 我们可以通过context去进行commit相关的操作, 也可以获取
context.state等

Action的分发

在Vue组件中, 如果我们调用action中的方法, 那么就需要使用dispatch
◼ 同样的, 也是支持传递payload

Module

我们在moduleA中添加state、mutations、getters