Vue学习笔记——vuex

5.1.理解vuex

5.1.1.vuex是什么

1. 概念：专门在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。
2. Github地址：https://github.com/vuejs/vuex

5.1.2.什么时候使用vuex

1. 多个组件依赖于同一状态
2. 来自不同组件的行为需要变更同一状态

5.1.3.案例

5.1.4.Vuex工作原理图

5.2.vuex核心概念和API

5.2.1.state

1. vuex管理的状态对象
2. 他应该是唯一的
3. 示例代码：

const state={
	xxx:initValue
}

5.2.2.actions

1. 值为一个对象，包含多个响应用户动作的回调函数
2. 通过commit()来触发mutation中函数的调用，间接更新state
3. 如何触发actions中的回调？
   在组件中使用：

$store.dispatch('对应的 action 回调名')

触发

4.可以包含异步代码（定时器，ajax等等）
5.示例代码：

const actions={
    zzz({commit,state},data1){
        commit('yyy',{data1})
    }
}

5.2.3.mutations

1. 值是一个对象，包含多个直接更新state的方法

2. 谁能调用mutations中的方法？如何调用？
   在action中使用：commit(‘对应的mutations方法名’) 触发

3. mutations中方法的特点：不能写异步代码、只能单纯的操作stata

4. 示例代码：

const mutations={
    yyy(state,{data1}){
        //更新state的某个属性
    }
}

5.2.4.getters

1. 值为一个对象，包含多个用于返回数据的函数
2. 如何使用？——$store.getters.xxx
3. 示例代码：

const getters={
    mmm(state){
        return state.msg+'!'
    }
}

5.2.5.modules

1. 包含多个module
2. 一个module是一个store的配置对象
3. 与一个组件（包含有共享数据）对应