vuex是 vue官方推薦的一個(gè)狀態(tài)管理器。當(dāng)我們遇到很多狀態(tài)改變時(shí)，組件之間的通信就會(huì)變得復(fù)雜，這時(shí)候vuex的強(qiáng)大就展現(xiàn)出來(lái)。

我們從vuex的原理以及vuex的api兩個(gè)部分介紹vuex

原理：

vuex的核心是store對(duì)象，它承載了vue的狀態(tài)管理。vuex的實(shí)現(xiàn)分為了2個(gè)部分，第一個(gè)部分是store的創(chuàng)建，以及第二部分store的掛載，并且解析store。

vuex通過插件安裝的形式來(lái)使得vue掛載vuex的store，當(dāng)然這個(gè)是在vue組件的createBefore階段實(shí)現(xiàn)的。隨后Vuex將它直接掛載到 $options.$store 以供使用vue使用。

對(duì)于vuex的屬性，Vuex 會(huì)將 vuex 屬性解構(gòu)成 getters 和 actions。并將 getters 的每個(gè)屬性都掛載 vm 下(有可能被組件的 $options.data() 的屬性覆蓋)，同時(shí)定義每個(gè)值的 getter 方法，但并不會(huì)定義 setter 方法，這是因?yàn)楦鶕?jù) Vuex 的設(shè)計(jì)是不允許開發(fā)者直接在組件內(nèi)更改 store.state，而對(duì)數(shù)據(jù)的改動(dòng)要通過提交 mutation。Vuex 實(shí)際上將 vm.vuex.getter 內(nèi)的屬性當(dāng)作當(dāng)前 vm 的計(jì)算屬性來(lái)處理。和計(jì)算屬性的區(qū)別是計(jì)算屬性依賴計(jì)算的是 vm.$options.data 內(nèi)的值，而 vm.vuex.getter 的屬性依賴計(jì)算的是 store._vm.$options.data。這樣所有組件的渲染都將都可以直接從狀態(tài)樹拿數(shù)據(jù)來(lái)渲染 UI 。

所有的組件都可以和vuex的狀態(tài)樹進(jìn)行數(shù)據(jù)交互。但是不允許直接改變狀態(tài)樹的狀態(tài)，應(yīng)該用vuex的mutations來(lái)提交狀態(tài)的改變。vuex會(huì)將actions內(nèi)的方法綁定到vue的$options.methods下，它們與vue中定義的方法并沒有區(qū)別。而 actions 內(nèi)的方法將通過 dispatch 觸發(fā) mutations 來(lái)更新全局狀態(tài),actions方法與mutations的區(qū)別是，mutations改變state并且必須是同步改變，而actions可以作為異步提交的方法，dispatch 可以接收一個(gè)promise，并且返回一個(gè)promise。

2.API：

state：在vue中引入store對(duì)象，在子組件中通過this.$store來(lái)訪問vuex中狀態(tài)，并且我們最好在vue的computed中獲取vuex的狀態(tài)。

mapState：這是一個(gè)語(yǔ)法糖，可以快捷的獲取更多的state。

接受一個(gè)object參數(shù)：

移動(dòng)開發(fā)培訓(xùn),Android培訓(xùn),安卓培訓(xùn),手機(jī)開發(fā)培訓(xùn),手機(jī)維修培訓(xùn),手機(jī)軟件培訓(xùn)

// 在單獨(dú)構(gòu)建的版本中輔助函數(shù)為 Vuex.mapStateimport { mapState } from 'vuex'export default {  // ...  computed: mapState({    // 箭頭函數(shù)可使代碼更簡(jiǎn)練
    count: state => state.count,    // 傳字符串參數(shù)&nb