整体印象：用于维护一个或多个State，在整个Vue工程中共享数据
数据仓储模型
数据同步模型
使用Vuex仓库
要使用vuex仓库，需要先安装vuex组件。之后引入Vuex到其main.js中（就是根组件）然后再注册该组件
import Vuex from 'vuex'
.........
.........
Vue.use(Vuex)
之后声明store（Store可以再main.js中声明也可以单独建立文件声明）
其中可以添加五种选项。主要的选项包括：state,mutations,actions
简单来说，state中设置参数。getter中接收State并设置对State中数据进行处理返回。mutations中接收state并设置对state进行处理的函数。actions中接收dispatch中传来的命令（指定函数与操作），在指定函数内部进行与外部的异步数据交换，之后执行commit跳转到mutation阶段。
let store = new Vuex.Store({
state: {
totalPrice: 0
},
getters: {
getTotal (state) {
return state.totalPrice
}
},
mutations: {
increment (state, price) {
state.totalPrice += price
},
decrement (state, price) {
state.totalPrice -= price
}
},
actions: {
increase (context, price) {
context.commit('increment', price)
}
}
})
使用逻辑:
其中state是存储公有状态的元素。Mutation通过函数直接修改state。而actions通过commit来调用Mutation的函数。而组件通过dispatch方法来使用action中的函数。Actions中可以调用api,其它的不可以。
commit函数：
a) 在action中的commit函数：
需要引入context与要传入的参数（price）
其中commit的参数，第一个是要使用的mutation中的函数（’increment’）,第二个是需要传递给mutation的参数。
b) 在组件中直接使用commit函数，跳过action阶段：
直接使用this.store调用commit函数
dispatch函数
在组件的methods中声明，并使用相应的action
其中第一个参数是要使用的action函数，第二个参数是要传递的参数信息。
getters组件
getters用来直接或带处理的获取state的值并返回。
在store中设置一个getter函数，之后在组件中调用函数。
例如：
computed: {
getTotal () {
return this.$store.getters.getTotal()
}
}
Modules组件
声明多个module以切分整理state中繁杂的仓库参数，其中最简单的实现情况：
const moduleA = {
state: { ... },
mutations: { ... },
actions: { ... },
getters: { ... }
}
const moduleB = {
state: { ... },
mutations: { ... },
actions: { ... }
}
const store = new Vuex.Store({
modules: {
a: moduleA,
b: moduleB
}
})
store.state.a // -> `moduleA`'s state
store.state.b // -> `moduleB`'s state
在多module环境下，其中的state参数都代表本地的state。如果要使用主store的state则用rootState
官方建议的文档组织形式
├── index.html
├── main.js
├── api
│ └── ... # abstractions for making API requests
├── components
│ ├── App.vue
│ └── ...
└── store
├── index.js # where we assemble modules and export the store
├── actions.js # root actions
├── mutations.js # root mutations
└── modules
├── cart.js # cart module
└── products.js # products module
主文件为index.js，其中的actions与mutations方法都被分离为单独的文件。
