众所周知，看文档是很重要的
1. Vuex是什么
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。
可以认为它是一个前端数据库，可以随时存取数据，对于整个前端是共享且同步的。
2. 使用Vuex的好处
在以下两种情况下，普通的方法是很麻烦做到，或者做不到的。
- 多个视图依赖于同一状态。
在兄弟组件中，维护同一状态是无能为力的
- 来自不同视图的行为需要变更同一状态。
就好像两个页面会互相影响，这需要我们在每个页面加入传值参数，代码变得更难维护。
3. Vuex的核心概念
- State
用来存放组件之间共享的数据。他跟组件中的data选项，只不过组件中data是用来存放组件的私有数据。 - Getter
有时候我们需要从 store 中获取一些数据，使用Getter来获取，Getter可以对数据进行操作，类似于computed。 - Mutation
更改 Vuex 的 store 中的状态的唯一方法，且为同步方法，类似methods。 - Action
Action会通过Mutation，让Mutation帮他提交数据的变更。
Action支持异步请求 - Module
当应用变得非常复杂时，store 对象就有可能变得相当臃肿。Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块。
3. Vuex操作流程
image.png
- 登录
- 首先调用
actions里的登录方法（这里是一个异步的方法） - 返回结果后调用
mutations中的SET_INFO方法 - 而
SET_INFO去修改state中的userInfo信息
- 首先调用
- 获取用户信息
- 这里调用
getter中方法getUserInfo - 然后就会返回当前
state中userInfo的数据
- 这里调用
- 修改用户信息
- 类似获取信息，这里调用
mutations中的SET_USERINFO方法 -
SET_USERINFO方法修改state中的userInfo
- 类似获取信息，这里调用
总结：
-
state中只维护当前需要存的数据，定义好即可 - 修改
state中的数据需要通过mutations中的方法 -
mutations中的方法必须为同步的，例如（state.token = token） - 修改
state中的数据需要通过getter中的方法 -
actions中可以使用异步方法
