每個Vuex應用的核心就是store(倉庫)?!皊tore”基本上就是一個容器,它包含著你的應用中大部分的狀態(state)。
Vuex和單純的全局對象有以下兩點不同:
1.Vuex的狀態存儲是響應式的。當Vue組件從store中讀取狀態的時候,若store中的狀態發生變化,那么相應的組件也會相應地得到高效更新。
2.你不能直接改變store中的狀態。改變store中的狀態的唯一途徑就是顯式地提交(commit)mutation。
簡單創建使用示例
//如果在模塊化構建系統中,要確保在開頭調用Vue.use(Vuex)
const store= new Vuex.Store({
state:{
count:0
},
mutations:{
addcount(state){
state.count++
}
}
})
通過store.state來獲取狀態對象,以及通過store.commit方法觸發狀態變更:
store.commit('addcount')
console.log(store.state.count) //1
強調,通過提交mutation的方式,而非直接改變store.state.count,是因為想更明確地追蹤到狀態的變化。
由于store中的狀態是響應式的,在組件中調用store中的狀態簡單到僅需要在計算屬性中返回即可。觸發變化也僅僅是在組件的methods中提交mutation。
本文來源vuex官網