vuex基本內容

 

1.vuex多個組件共享狀態

以一個全局的單例模式管理，把組件的共享狀態抽離出來，在這種模式下，組件樹構成了一個巨大的"視圖"，不管在樹的哪個位置，任何組件都能獲取狀態或觸發行爲

通過定義和隔離狀態管理中的各種概念並通過強制規則維持視圖和狀態間的獨立性

Vuex是專門爲Vue.js設計的狀態管理庫

2.vuex基本內容

Vuex應用的核心是store（倉庫），"store"基本上就是一個容器，包含應用中的大部分狀態（state）

3.Vuex和單純的全局對象不同

Vuex的狀態存儲是響應式的，當Vue組件從store中讀取狀態的時候，若store中的狀態發生變化，相應的組件會高效更新

不能直接改變store中的狀態，改變store中的狀態的唯一途徑是顯式的提交（commit）mutation，可以很方便的跟蹤每一個狀態的變化

4.創建一個最簡單的store

一個初始的state對象和一些mutation

//如果在模塊化構建系統中，確保在開頭調用了Vue.use(Vuex)

const stroe = new Vuex.Store({
    state:{
        count:0
    },
    mutations:{
        increment(state){
            state.count++   //store.state獲取狀態對象
        }
    }
})

可以通過store.state獲取狀態對象，通過store.commit方法觸發狀態變更

store.commit('increment')
console.log(store.state.count)

追蹤狀態的變化，通過提交mutation的方式，不能直接改變store.state.count

store中的狀態是響應式的，在組件中調用store中的狀態需要在計算屬性中返回即可，出發變化在組件中的methods中提交mutation