怎么在Vuex中查詢數(shù)據(jù)狀態(tài)

怎么在Vuex中查詢數(shù)據(jù)狀態(tài)？很多新手對(duì)此不是很清楚，為了幫助大家解決這個(gè)難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來(lái)學(xué)習(xí)下，希望你能有所收獲。

import store from './store' 
new Vue({
 el: '#app',
 router,
 store,
 components: { App },
 template: '<App/>'
})

1.在子組件中通過(guò)this.$store.state.變量名在子組件中訪問(wèn)state中某個(gè)變量的值

this.tabbarActive = this.$store.state.tabbarActive //這里的tabbarActive為存儲(chǔ)在vuex中state的變量名

2.在子組件中通過(guò)this.$store.commit(‘方法名'，參數(shù))來(lái)進(jìn)行對(duì)vuex中的數(shù)據(jù)狀態(tài)進(jìn)行更新/插入

1）由于vuex中store的改變唯一的途徑是提交mutation,通過(guò)調(diào)用實(shí)例化后的vuex，mutations中相對(duì)應(yīng)的方法可以實(shí)現(xiàn)對(duì)狀態(tài)值的改變，其中payload可以為參數(shù)對(duì)象，或者單個(gè)值，state參數(shù)在調(diào)用時(shí)默認(rèn)為第一個(gè)參數(shù)可以不傳，但是在mutations中申明該函數(shù)時(shí)必須傳入state

  mutations: {
  changeTarBar (state,payload) {
   state.tabbarActive = payload
  }
 }

–在子組件中更新store中的狀態(tài)

this.$store.commit("changeTarBar",idx)//其中idx為傳入的參數(shù)

–或者這種寫法,此時(shí)的payload則為一個(gè)參數(shù)對(duì)象，可以通過(guò)payload.idx獲得子組件傳入的參數(shù)值

 this.$store.commit({
  type:'changeTarBar',//type對(duì)應(yīng)方法名
  idx,
 })

看完上述內(nèi)容是否對(duì)您有幫助呢？如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章，請(qǐng)關(guān)注億速云行業(yè)資訊頻道，感謝您對(duì)億速云的支持。