Vue前端项目-Vuex实战使用
目录
本章教程会结合 Vue 前端项目 以及 Vuex官网的知识点来介绍，Vuex在实战项目中到底如何使用？
1、创建 vue-cli 脚手架项目
因为本章教程只是介绍 Vuex 相关的知识点，所以 vue-cli 脚手架创建项目参考自：
https://blog.****.net/u010559460/article/details/104709597
2、安装 vuex
安装过程略，安装结果如图：
3.将 store 实例注册到 Vue对象
把 store 对象提供给 “store” 选项，这可以把 store 的实例注入所有的子组件
4. store 实例对象
步骤3 将到需要一个 store 实例对象注册到 Vue的属性。
本步骤将定义一个 全局的 store。
创建 src / store / index.js 文件，内容如图：
5、将 store 分割成模块化（Module）
下图来自官网的模块化介绍：
6、项目中的模块化
在 src / store / index.js 文件中
拿 user 模块 举例，创建 src / store / modules / user.js 文件
7. 模块化文件
拿 user 模块 举例，创建 src / store / modules / user.js 文件
我们在 state 中定义 需要存放在 store 中的数据
在 mutations 中修改 store 中的数据，但需要注意 mutations 中定义的方法是同步的
在 actions 中定义异步方法，通常我们会调用这个异步方法获取数据后 再调用 mutations 中的方法将数据存储到 store 中
8. action 中的第一个参数
9. 如何调用 action 中的方法
10. 项目中是如何 调用 action 中的方法
11. Getter 获取 store 中存放的数据
官网例子:
12 项目中getters 使用
13. mapGetters 辅助函数 获取数据
14. store.getters方式获取数据