詳解關(guān)于Vuex的action傳入多個(gè)參數(shù)的問題
問題:
已知Vuex中通過actions提交mutations要通過context.commit(mutations,object)的方式來完成
然而commit中只能傳入兩個(gè)參數(shù),第一個(gè)就是mutations,第二個(gè)就是要傳入的參數(shù)
一開始遇到的問題是加入購物車方法中要傳入一個(gè)字典對象里面保存產(chǎn)品信息item,還要傳入一個(gè)產(chǎn)品數(shù)量的參數(shù)num
然而如果這么寫的話就會報(bào)錯(cuò):context.commit(mutations,item,num)
解決辦法:
將第二個(gè)參數(shù)以對象的放式提交就像這樣
mutations = { PRODUCT_ADDTO_CART:(state,product) => { //code } } actions = { productaddtocart:(context,value) => { context.commit('PRODUCT_ADDTO_CART', value); }, }
在頁面調(diào)用方法的時(shí)候是這樣的:
productAddToCart(item,productNum){ this.productaddtocart({"item":item,"num":this.productNum}) }
這里的關(guān)鍵信息是將參數(shù)打包成一個(gè)字典對象傳入,在mutations里面調(diào)用的話就product.item,product.num就解決了
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
詳解Vue中Computed與watch的用法與區(qū)別
這篇文章主要介紹了Vue中computed和watch的使用與區(qū)別,文中通過示例為大家進(jìn)行了詳細(xì)講解,對Vue感興趣的同學(xué),可以學(xué)習(xí)一下2022-04-04vue項(xiàng)目前端加前綴(包括頁面及靜態(tài)資源)的操作方法
這篇文章主要介紹了vue項(xiàng)目前端加前綴(包括頁面及靜態(tài)資源)的操作方法,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2023-12-12Vue+SpringBoot實(shí)現(xiàn)支付寶沙箱支付的示例代碼
本文主要介紹了Vue+SpringBoot實(shí)現(xiàn)支付寶沙箱支付的示例代碼,文中通過示例代碼介紹的非常詳細(xì),需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-06-06vue實(shí)現(xiàn)動(dòng)態(tài)路由詳細(xì)
我們開發(fā)后臺管理系統(tǒng)過程中,會由不同的人操作系統(tǒng),有admin(管理員)、superAdmin(超管),及各種運(yùn)營、財(cái)務(wù)人員。為了區(qū)別這些人員,會給不同的人分配不一樣的角色來展示不同的菜單,這就必須要通過動(dòng)態(tài)路由來實(shí)現(xiàn)。下面就來介紹vue實(shí)現(xiàn)動(dòng)態(tài)路由,需要的朋友可參考一下2021-10-10vue3+ts+echarts實(shí)現(xiàn)按需引入和類型界定方式
這篇文章主要介紹了vue3+ts+echarts實(shí)現(xiàn)按需引入和類型界定方式,具有很好的參考價(jià)值,希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10vue實(shí)現(xiàn)手機(jī)號碼的校驗(yàn)實(shí)例代碼(防抖函數(shù)的應(yīng)用場景)
這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)手機(jī)號碼的校驗(yàn)的相關(guān)資料,主要是防抖函數(shù)的應(yīng)用場景,文中通過示例代碼介紹的非常詳細(xì),對大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09