vuex小记

Vuex

状态管理(vuex) store（集中式的存储管理）

什么时候用： 打算开发中大型应用

集中式数据管理, 一处修改，多处使用

思维流程:
store.js
this.$store.commit{(}^{\prime }incremen{t}^{\prime })->mutationsthis.$store.dispatch(‘jia’) -> actions
mapActions() ->actions mapGetters()->getters

      学生          代课老师         校长           财务      班主任             学生

(view）component - dispatch > action -> mutation -> state <- getter <- component
发送请求 处理 修改状态
业务逻辑 修改state 读取state
异步

1. 什么是状态

​ 我们使用一条数据去管理一个视图，那么这个数据我们就称之为 ‘状态’

2. vuex是做什么的？

​ Vuex是一个集中式的存储管理中心，vuex中可以用来存储 数据（ 状态 ）

​ vuex也是一个状态管理中心，它也可以进行状态的管理

3. 什么是状态管理模式？

​ 我们使用一条数据去管理一个视图，那么这种管理模式就称之为 状态管理

4. 什么时候使用vuex

中大型应用使用 （使用的时间）

5. vuex的开发流程

四个方案：

1. 前： 标准    后： 标准  √

2. 前： 标准    后： 非标准  √

3. 前:  非标准  后： 非标准  √

4. 前： 非标准  后： 标准  √

前标准：用 this.$store.dispatch('incrment',payload) 这种的负载为action.payload
前非标准： 用 this.$store.commit('incrment',payload) 这种在mutations中的参数action就是负载
后标准：用this.$store.getters来接收数据
后非标准： 用this.$store.state...来接收数据

component ---dispatch---> actions ---commit--->mutations---state <----getters----component

6. 解决了三个工具 mapActions mapMutations mapGetters mapState

export default 默认导出一个

export 叫批量导出，可以导出多个

对应小业务：

1. 使用vuex实现计数
2. 使用vuex实现todolist中添加（ 使用数据分块 module ）
3. vuex实现购物车

将来我们的数据

​ 希望是分块管理的，这样方便我们将来为何和更新

vue是通过一个叫做 module 的模块来管理的

​ vue项目中 store下的一个目录就是一个数据包