1.安装
npm install vuex --save
2.引入
在src中新建文件夹--命名为store，在文件中建立store.js，引入vuex
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
export default new Vuex.Store({
state,
mutations
})
3.核心
state：状态的存储；
mapState：当组件需要获取多个状态时，可以用mapState映射store.state
...mapState({
count:state=>state.count
})
mutations:vuex状态的唯一提交方法，-----必须是同步；mutations的触发方式是commit（type,payload）;payload:最好是对象，type是方法名称；
遵循的规则:
a.在运用之前就初始化好需要的属性；
b.用新对象替换老对象。es6新属性：对象展开运算符：eg:state.obj={...state.obj}
c.使用常量替代mutations的事件类型，
新建一个文件命名为：mutation-types.js------export const SOME_MUTATION = 'SOME_MUTATION';
在store.js中引用，import {SOME_MUTATION} from './mutation-types'
const store = new Vuex.Store({
state:{...},
mutations:{
[SOME_MUTATAION](state){...}
}
})
...mapMutations({
add:方法
})
Actions:提交的mutation，而不是直接改变状态，actions可以包含任意异步操作。
const store = new Vuex.Store({
state: { count: 0 },
mutations: {
increment (state) {
state.count++
}
},
actions: {
increment (context) {
context.commit('increment') }
}
})
mapActions辅助函数，将methods映射为store.dispatch调用，eg：
import { mapActions } from 'vuex'
export default {
// ...
methods: {
...mapActions([
'increment' // 映射 this.increment() 为 this.$store.dispatch('increment')
]),
...mapActions({
add: 'increment' // 映射 this.add() 为 this.$store.dispatch('increment')
})
}
}
modules:模块化