Vuex狀態管理

1.Vuex 是一個專為 Vue.js 應用程式開發的狀態管理模式。(可以當成全域性物件理解。)

2.Vuex 和單純的全域性物件有兩點不同：
1、Vuex 的狀態儲存是響應式的
2、改變 store 中的狀態的唯一途徑就是顯式地提交 (commit) mutation。

3.Vuex的核心是store，store包含著應用中大部分的狀態 (state)。

4.一個最簡單的store包含state與mutation，可以通過 store.state 來獲取狀態物件，以及通過 store.commit 方法觸發狀態變更

5.重點強調，我們通過提交 mutation 的方式，而非直接改變 store.state.count，是因為我們想要更明確地追蹤到狀態的變化。這個簡單的約定能夠讓我們的意圖更加明顯，這樣你在閱讀程式碼的時候能更容易地解讀應用內部的狀態改變。

6.【讀資料】State:儲存著應用中的所有基礎“全域性物件”，this.$store.state.XXX可訪問到。
mapState：使用此輔助函式幫助我們生成計算屬性，獲得多個state值。

7.【讀資料】Getter：從 store 中的 state 中派生出一些狀態。
Getter 接受 state 作為其第一個引數。第二個引數可傳值計算。
Getter 會暴露為 store.getters 物件，可以以屬性的形式訪問這些值。
mapGetters 輔助函式同mapState思想理解。

8.【改資料】Mutation：
Vuex 中的 mutation 非常類似於事件：每個 mutation 都有一個字串的 事件型別 (type) 和 一個 回撥函式 (handler)。這個回撥函式就是我們實際進行狀態更改的地方，並且它會接受 state 作為第一個引數。
可以向 store.commit 傳入額外的引數，即 mutation 的 載荷（payload）。
還有一條重要的原則就是要記住 mutation 必須是同步函式

9.【改資料的提交】Mutation
在元件中使用 this.$store.commit('xxx') 提交 mutation，或者使用 mapMutations 輔助函式將元件中的 methods 對映為 store.commit 呼叫
10.【寫法】Mutation
使用常量替代 Mutation 事件型別。

11.【改資料】Actions
Action 類似於 mutation，不同在於：
Action 提交的是 mutation，而不是直接變更狀態。
Action 可以包含任意非同步操作。
Action 通過 store.dispatch 方法觸發.
在元件中使用 this.$store.dispatch('xxx') 分發 action，或者使用 mapActions 輔助函式將元件的 methods 對映為 store.dispatch 呼叫。

12【Module】
應用的所有狀態會集中到一個比較大的物件。當應用變得非常複雜時，store 物件就有可能變得相當臃腫。
為了解決以上問題，Vuex 允許我們將 store 分割成模組（module）。