state
1）vuex管理状态的对象
2）它应该是唯一的
const state = {
xxx:initValue
}
mutations
1）包含多个直接更新state的方法（回调函数）的对象
2）谁来触发：action中的commit（‘mutation名称‘）
3）只能包含同步代码，不能写异步代码
const mutations = {
yyy (state, {data1}) {
// 更新 state 的某个属性
}
}
actions
1）包含多个时间回调函数的对象
2）通过执行：commit()来触发mutation的调用，简介更新state
3）谁来触发：组建中：$store.dispatch（‘action 名称’,data1）//‘zzz‘
4）可以包含异步代码（定时器，ajax）
const actions = {
zzz（{commit,state},data1）{
commit(‘yyy‘,{data1})
}
}
getters
1）包含多喝计算属性（get）的对象
2）谁来读取：组件中：$store.getters.xxx
const getter = {
mmm(state) {
return...
}
}
modules
1）包含多个module
2）一个module是一个store的配置对象
3）与一个组件（包含共享数据）对应
向外暴露store对象
export default new Vuex.Store({
state,
mutations,
actions,
getters
})
组件中
import {mapState, mapGetters, mapActions} from ‘vuex‘
export default {
computed: {
...mapState([‘xxx‘]),
...mapGetters([‘mmm‘]),
}methods: mapActions([‘zzz‘])
}
{{xxx}} {{mmm}} @click="zzz(data)"
映射store
import store from ‘./store‘
new Vue({ store
}）
store对象
1）所有用vuex管理的组件中多了一个属性$store，他就是一个store对象
2）属性：
state：注册的state对象
getters：注册的getters对象
3）方法：
dispatch(actionName,data):分发调用action