1.首先，我們先了解什么是Vuex,Vuex 是一個專為 Vue.js 應用程序開發的**狀態管理模式**。
這個狀態自管理應用包含以下幾個部分：
* **state**，驅動應用的數據源；
* **view**，以聲明方式將**state**映射到視圖；
* **actions**，響應在**view**上的用戶輸入導致的狀態變化。
如果您的應用夠簡單，您最好不要使用 Vuex。一個簡單的[store 模式](https://cn.vuejs.org/v2/guide/state-management.html#%E7%AE%80%E5%8D%95%E7%8A%B6%E6%80%81%E7%AE%A1%E7%90%86%E8%B5%B7%E6%AD%A5%E4%BD%BF%E7%94%A8)就足夠您所需了。但是，如果您需要構建一個中大型單頁應用，您很可能會考慮如何更好地在組件外部管理狀態，Vuex 將會成為自然而然的選擇。
2.接下來，我們開始安裝Vuex，使用命令：`npm install vuex --save`
安裝成功后，我們在src目錄下新建 store 文件夾，然后新建 index.js 文件，目錄結構如下
在store/index.js文件中，創建vuex實例
```
~~~
import Vue from 'vue' // 引入vue
import Vuex from 'vuex' // 引入vuex
// 使用vuex
Vue.use(Vuex)
// 創建vuex實例
const store = new Vuex.Store({
})
export default store // 導出store
~~~
```
3.然后，在main.js中引入該文件
4.開始我們的vuex業務代碼
### State
vuex的數據源，我們需要保存的數據保存在這里，在頁面通過 this.$store.state來獲取數據
*****
*****
當一個組件需要獲取多個狀態的時候，將這些狀態都聲明為計算屬性會有些重復和冗余，我們可以使用`mapState`輔助函數幫助我們生成計算屬性。
這樣就簡便很多啦
### Getter
Vuex 允許我們在 store 中定義“getter”（可以認為是 store 的[計算屬性](https://cn.vuejs.org/v2/guide/computed.html))）。就像計算屬性一樣，getter 的返回值會根據它的依賴被緩存起來，且只有當它的依賴值發生了改變才會被重新計算。
*****
*****
`mapGetters`輔助函數
### Mutation
如果我們需要修改count值，那就需要mutation，更改 Vuex 的 store 中的狀態的唯一方法是提交 mutation。
count加1，減1
點擊按鈕運行效果
### Action
Action 類似于 mutation，不同在于：
* Action 提交的是 mutation，而不是直接變更狀態。
* Action 可以包含任意異步操作。
* mutation 必須同步執行，Action 就不受約束！我們可以在 action 內部執行異步操作
運行結果
我們還可以自定義參數，控制每次點擊增加或減少的數量
運行結果
