5.vuex

一、理解vuex

1.是什么

概念：

1. 专门在Vue中实现集中式状态（数据）管理的一个Vue插件
2. 对Vue应用中多个组件的共享状态进行集中式的管理（读/写）
3. 是一种组件间通信的方式，且适用于任意组件间通信,实现多组件共享数据

2.什么时候使用Vuex

1. 多个组件依赖于同一状态

2. 来自不同组件的行为需要变更同一状态

3.Vuex工作原理

• actions：需要发送ajax请求的东西放在这里、或者需要判断等业务逻辑放在这

4.搭建Vuex环境

1. 下载vuex

npm i vuex    // 默认安装最新版本的

npm i vuex@3    //指定vuex的版本为3，和vue2搭配使用

2. 引入vuex

3. 创建并暴露store

4. 使vm和vc上都有store

5.求和案例

1. 求和

2. 多个复杂操作可将业务逻辑写在actions里

count.vue

store/index.js

3. 没有业务逻辑可以直接调用mutations里面的方法

并删掉actions中的方法

二、vuex核心概念和API

1.getters配置项

用于对state中的数据进行加工

2.mapState

模板中书写过多的$store.state.变量十分麻烦，借助mapState生成计算属性，从state中读取数据

• 对象写法

• 数组写法

3.mapGetters

方法中书写过多的$store.getters很麻烦

4.mapMutations

方法中书写过多的$store.commit很麻烦

数组写法，方法名和mutations中的方法名一致

5.mapActions

方法中书写过多的 $store.dispath很麻烦

三、vuex模块化

1.简写形式的模块化

1. 分别配置

2. 添加命名空间

3. 暴露store

4. mapState中指定第一个参数

5. mapActions和mapMutations中指定第一个参数

2.普通形式的模块化