vuex 就是” 前端的数据库“。
1、State 就是数据库。
2、Mutations 就是我们把数据存入数据库的 API，用来修改 state 的。
3、getters 是我们从数据库里取数据的 API。
4、actions 呢。你想呀，后端从前端拿到了数据，总要做个处理吧，处理完了再存到数据库中。其实这就是 action的过程。当然你也可以不做处理，直接丢到数据库，所以vuex也可以在 action 中直接存，就是直接mutation。
vuex 的数据流：
后（qian）端通过 action处理数据，然后通过 mutation 把处理后的数据放入数据库（state）中，谁要用就通过 getter从数据库（state）中取。
一段基本的vuex结构的代码
const store = new Vuex.Store({
state: {
name: 'weish',
age: 22
},
getters: {
personInfo(state) {
return `My name is ${state.name}, I am ${state.age}`;
}
}
mutations: {
SET_AGE(state, age) {
commit(age, age);
}
},
actions: {
nameAsyn({commit}) {
setTimeout(() => {
commit('SET_AGE', 18);
}, 1000);
}
},
modules: {
a: modulesA
}
}
vuex 包含有五个基本的对象：
1、state：存储状态。也就是变量；
2、getters：派生状态。也就是set、get中的get，有两个可选参数：state、getters分别可以获取state中的变量和其他的getters。外部调用方式：store.getters.personInfo()。就和vue的computed差不多；
3、mutations：提交状态修改。也就是set、get中的set，这是vuex中唯一修改state的方式，但不支持异步操作。第一个参数默认是state。外部调用方式：store.commit('SET_AGE', 18)。和vue中的methods类似。
4、actions：和mutations类似。不过actions支持异步操作。第一个参数默认是和store具有相同参数属性的对象。外部调用方式：store.dispatch('nameAsyn')。
5、modules：store的子模块，内容就相当于是store的一个实例。调用方式和前面介绍的相似，只是要加上当前子模块名，如：store.a.getters.xxx()。
更详细可以参考：
https://segmentfault.com/a/1190000009404727
mapgetter mapmutation：https://www.jianshu.com/p/506da488d2a1
