研究了一段時(shí)間的vuex,只是簡單地會用,對于里面的一些知識點(diǎn)還是
不太會表達(dá),就目前,先梳理一下自己對vuex中幾個(gè)主要概念的理解
vuex一個(gè)專為 Vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式,主要是為了解決組
件間的通信,方便數(shù)據(jù)的共用,如果不使用vuex,數(shù)據(jù)之間或許可以
用子組件的傳值來解決,但是比較麻煩。
概念的理解
state: 狀態(tài)管理 ,儲存初始化數(shù)據(jù)
getters:相當(dāng)于store的計(jì)算屬性,對State 里面的數(shù)據(jù)二次處理
mutations:改變state狀態(tài)的函數(shù),對數(shù)據(jù)進(jìn)行計(jì)算的方法全部寫在里面,
每個(gè)mutation都有一個(gè)事件類型和一個(gè)回調(diào)函數(shù),回調(diào)函數(shù)必須是同步
的,通過this.$store.commit('decrement')來觸發(fā)
actions:主要是commit mutations,而不是用于直接更變狀態(tài),是異步
操作,通過this.$store.dispatch('decrement')來觸發(fā)
mapState 輔助函數(shù),把全局的 state映射到當(dāng)前組件的 computed 計(jì)算
屬性中,返回的是一個(gè)對象
之所以使用mapstate:當(dāng)一個(gè)組件需要獲取多個(gè)狀態(tài)時(shí)候,將這些狀
態(tài)都聲明為計(jì)算屬性會有些重復(fù)和冗余。
mapGetters:把全局的getters映射到當(dāng)前組件的 computed 計(jì)算屬性
中,返回的是一個(gè)數(shù)組
computed:mapGetters([
'count'
//映射 this.count 為 store.getters.count
]),
mapMutations:將組件中的 methods 映射為 store.commit 調(diào)用
methods:{
...mapMutations([
'add'
//映射 this.add() 為 this.$store.commit('add')
])
},
mapActions::將組件中的 methods 映射為 store.dispatch 調(diào)用
methods:{
...mapActions([
'increment'
// //映射 this.increment() 為 this.$store.dispatch('increment')
])
},
文章名稱:vuex的理解與使用
本文地址:http://www.chinadenli.net/article30/gjodpo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供手機(jī)網(wǎng)站建設(shè)、、移動網(wǎng)站建設(shè)、微信小程序、網(wǎng)站改版、品牌網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)