Vuex 是什么？？？？
如果用官方的話說，是以下這段：
Vuex 是一個專為 Vue.js 應用程序開發的狀態管理模式。它采用集中式存儲管理應用的所有組件的狀態，並以相應的規則保證狀態以一種可預測的方式發生變化。Vuex 也集成到 Vue 的官方調試工具 devtools extension，提供了諸如零配置的 time-travel 調試、狀態快照導入導出等高級調試功能。
但是當我真的入門 Vuex的時候他主要難的地方是 在5個應用中不斷的使用；
五個應用分別為：State，Getter，Mutation，Action，Module 這五個應用~
接下來我就帶大家來一起寫一次簡單的使用方法；
首先就是得下載 Vuex； npm i vuex -S
其次我們要在 vue-cli中創建好自己的項目目錄 😁
然后跟我一樣 在 src 中創建 一個主🐖目錄（容器） 起名叫 store；因為每個 Vuex 應用的核心就是 store（倉庫的意思）；
Vuex 的狀態存儲是響應式的。當 Vue 組件從 store 中讀取狀態的時候，若 store 中的狀態發生變化，那么相應的組件也會相應地得到高效更新。
然后在 store的目錄下 創建一個 store.js 用來接受之后各個應用的返回的東西~ 👍
然后把 這個 store 注冊到 main.js 中 成為 vue的屬性
弄好了之后呢， 先別急 我們要把每個應用分別放在不同的文件夾中，所以就創建了四個應用，然后分別創建他們相對應的js文件（module放在最后再講哦，先別急）
創建好了就是這個樣子啦；
那創建好了之后我們就開始 第一個吧~
因為要是想看展示狀態的話，用動態的方法最好了吧， 那就自己創建一個 vue的組件用來 學習這個東西吧！
在創建好了之后我們要實現一個東西就是：點擊按鈕讓 count的數字 加1；
State 的 簡介是： Vuex 使用單一狀態樹——是的，用一個對象就包含了全部的應用層級狀態。至此它便作為一個“唯一數據源 (SSOT)”而存在。這也意味着，每個應用將僅僅包含一個 store 實例。單一狀態樹讓我們能夠直接地定位任一特定的狀態片段，在調試的過程中也能輕易地取得整個當前應用狀態的快照
這樣就能簡單實現了； 但是我們想到卻不是這樣的，我們要使用的是State 來看看這種效果，那就開始吧！
在 State的目錄下 找到state.js
簡單的聲明一個 變量； 然后暴露出去；在 store.js 里面接收一下~ 因為 store是倉庫嘛，所以你的東西都得告訴倉庫哦
這樣他就收到了 count的這個變量；
所以我們在 組件的模板中 就應該改變一些東西啦~
注意看 發生的變化
因為 我們把store 注冊到了 vue的實例上，變成了屬性，所以我們 console.log( vm ) 就能看到多了一個屬性叫 store
就是上面這個樣子了
所以我們剛才的那樣的寫法就是沒問題的；應該明白了叭~
這個就是State的寫法哦
然后就是 第二個應用寫法 Getter 官方給的說法是 store中的 getter （可以認為是store的計算屬性），就像計算屬性一樣，getter的返回值回根據他的依賴被緩存起來，且只有當的依賴值發生了改變才會被重新計算；
getter 可以 接受 state 作為其第一個參數； （我用圖來解釋叭）
在 getter的js中 返回一個函數叫 doublecount 的方法；
在 getters的js中 傳入了 state （ 因為 getters的第一個參數就是 state 所以這里能用到他有關的所有數據）
然后 返回了 state 中定義的 const；
在 vue的組件的模板中， 在方法里 讓 state中的const ++ ； 但是上面顯示的是 getters的應用格式；
Getter 也可以接受其他 getter 作為第二個參數； 具體的用法我就不寫啦，畢竟只是一個初級入門~
現在該第三個啦； 叫 Mutation啦
更改 Vuex 的 store 中的狀態的唯一方法是提交 mutation
Vuex 中的 mutation 非常類似於事件：每個 mutation 都有一個字符串的 事件類型 (type) 和 一個 回調函數 (handler)。這個回調函數就是我們實際進行狀態更改的地方，並且它會接受 state 作為第一個參數
上圖來解釋叭~
這里 用了，mutation 的 第一個參數（state 這個東西也是必填項），跟 第二個參數是 payload ，這里的payload 是一個對象；
一定要記得每次用了新的應用都要在 store.js 中記得掛載上哦；
每個mutation都得用commit 來進行操作
你可以向 store.commit 傳入額外的參數，即 mutation 的 載荷（payload）
payload.n 的意思是： 因為payload是一個對象，所以要用 Object.attribute的時候就這么寫啦~
所以 這里的東西 執行后的就是； 每次讓 const + 5；
這里其實還能用另一種的方式來寫：有一個是傳參的方式，那另一種就是 對象的方式來進行傳值；
就是這樣子的寫法啦~
下面就該第四種啦~ 叫做 Action ~
Action 類似於 mutation，不同在於：
- Action 提交的是 mutation，而不是直接變更狀態。
- Action 可以包含任意異步操作。
所謂的意思就是：mutation 里面傳的是不直接變更狀態；action 可以包含任意的異步操作；
這里寫一個簡單的例子~
讓 在 三秒后 讓const的數字加上3；
記得每次用新的時候 都要 在 store.js 里面進行掛載；
然后在 vue的組件模板中 寫入
這里要注意一下~ Action 用的 store.dispatch 來進行 方法觸發的；
這么寫完的話過了三秒，他就會 自動的 加上3 咯~
最后的一個應用是 Module啦
官方給出的解釋 是這樣的： 👇 ↓
由於使用單一狀態樹，應用的所有狀態會集中到一個比較大的對象。當應用變得非常復雜時，store 對象就有可能變得相當臃腫。
為了解決以上問題，Vuex 允許我們將 store 分割成模塊（module）。每個模塊擁有自己的 state、mutation、action、getter、甚至是嵌套子模塊——從上至下進行同樣方式的分割：
但是用的話，這里舉個簡單的例子叭；
要是這樣寫的話，前面的就得換一種寫法了~ 我直接就上圖了嗷
這里的意思是： 如果你要調用應用里面的變量的時候前都得多加一個叫 a 的對象哦；
因為 我們把都封存到了 modules 中 ，他們每個都是一個對象； 所以 寫法都得變一下~
那入門的介紹 也就介紹完了~ 喜歡的點個關注，評論個 666； 也不枉我寫的好幾個小時呀； 謝謝啦~