vuex輔助函數(shù)的使用mapGetters,mapActions,mapMutations

在vuex中,有些狀態(tài)屬性會有些重復(fù)和冗余,為了解決這個問題我們可以使用輔助函數(shù)來簡化處理代碼,輔助函數(shù)的使用方法如下
第一步:在當(dāng)前頁面導(dǎo)入輔助函數(shù)

import { mapGetters,mapActions } from "vuex";

第二步驟,使用輔助函數(shù),輔助函數(shù)的使用有兩種方法,使用數(shù)組和對象的方式,對象可以自定義屬性名和數(shù)組使用默認屬性名

//數(shù)組使用方式
methods: {
  ...mapActions([JIANNUM,ADDNUM])
  },computed: {
  ...mapGetters(['getcarttotalprice'])
  }
//對象的使用方式
methods: {
  ...mapActions({
  ’jiannum‘:JIANNUM,
  ’addnum‘:ADDNUM,
})
  },computed: {
  ...mapGetters({
’getprice‘:’getcarttotalprice‘
}) }

第三步:直接在div使用

  <span @click="addnum(item.iid)">+</span> //在iid寫在后面就可以直接給vuex中的方法傳參
 <i>{{getcarttotalprice}}</i> 

注意如果需要傳參數(shù)直接寫在事件后面就可以

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容