vuex中store存儲(chǔ)store.commit和store.dispatch的用法
代碼示例：
this.$store.commit('loginStatus', 1);
this.$store.dispatch('isLogin', true);
規(guī)范的使用方式：
// 以載荷形式
store.commit('increment'，{
amount: 10 //這是額外的參數(shù)
})
// 或者使用對(duì)象風(fēng)格的提交方式
store.commit({
type: 'increment',
amount: 10 //這是額外的參數(shù)
})
主要區(qū)別：
dispatch：含有異步操作，數(shù)據(jù)提交至 actions ，可用于向后臺(tái)提交數(shù)據(jù)
寫法示例：
this.$store.dispatch('isLogin', true);
commit：同步操作，數(shù)據(jù)提交至 mutations ，可用于登錄成功后讀取用戶信息寫到緩存里
寫法示例：
this.$store.commit('loginStatus', 1);
兩者都可以以載荷形式或者對(duì)象風(fēng)格的方式進(jìn)行提交
補(bǔ)充知識(shí)：如何獲取vuex的action的返回值（axios請(qǐng)求為例）
因?yàn)橹袄蠋熡兄v過將vuex的封裝。
今天就想嘗試寫一下，然后就封裝了。
但是我想要在vue組件里面獲取vuex的action的返回值
這里我用的dispatch調(diào)用 如圖
我這里使用的new Promise的方法
調(diào)用getlunbolist的時(shí)候返回一個(gè)new Promise，把需要的值用resolve帶出
在組件就可以用then的方法取出來使用
我只是一個(gè)小小白，我知道我的表述很生硬而且可能還不準(zhǔn)備，但是意思就是大概這個(gè)意思。而且會(huì)堅(jiān)持把我覺得有收獲的內(nèi)容下來的，希望以后成大佬了能自己來完善，當(dāng)然大佬們看到問題了可以多多指點(diǎn)一下小弟。
以上這篇vuex中store存儲(chǔ)store.commit和store.dispatch的用法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3使用quill富文本編輯器保姆級(jí)教程(附踩坑解決)
這篇文章主要給大家介紹了關(guān)于vue3使用quill富文本編輯器保姆級(jí)教程的相關(guān)資料,在許多網(wǎng)站和應(yīng)用程序中富文本編輯器是一種常見的工具,它使用戶能夠以直觀的方式創(chuàng)建和編輯文本內(nèi)容,需要的朋友可以參考下2023-11-11
vue 實(shí)現(xiàn)數(shù)字滾動(dòng)增加效果的實(shí)例代碼
最近做了個(gè)項(xiàng)目需要做數(shù)字滾動(dòng)增加的效果，剛開始接到這個(gè)項(xiàng)目還真是懵了，后來發(fā)現(xiàn)實(shí)現(xiàn)代碼很簡(jiǎn)單的，下面小編給大家?guī)砹藇ue 實(shí)現(xiàn)數(shù)字滾動(dòng)增加效果的實(shí)例代碼，需要的朋友參考下吧2018-07-07
Element-Plus Select組件實(shí)現(xiàn)滾動(dòng)分頁加載功能
Element-Plus的select組件并沒有自帶滾動(dòng)分頁加載的功能,其雖然提供了自定義下拉菜單的底部的方式可以自定義上一頁及下一頁操作按鈕的方式進(jìn)行分頁加載切換,這篇文章主要介紹了Element-Plus Select組件實(shí)現(xiàn)滾動(dòng)分頁加載功能,需要的朋友可以參考下2024-03-03
vue2和vue3中provide/inject的基本用法示例
Vue中的provide/inject是一種組件間通信的方式,它允許父組件向子組件傳遞數(shù)據(jù),而不需要通過props或事件來實(shí)現(xiàn),下面這篇文章主要給大家介紹了關(guān)于vue2/vue3中provide/inject的基本用法的相關(guān)資料,需要的朋友可以參考下2023-04-04
這篇文章主要給大家介紹了關(guān)于vue路由教程之靜態(tài)路由的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
如何使用 Vue Router 的 meta 屬性實(shí)現(xiàn)多種功能
在Vue.js中,Vue Router 提供了強(qiáng)大的路由管理功能,通過meta屬性,我們可以在路由定義中添加自定義元數(shù)據(jù),以實(shí)現(xiàn)訪問控制、頁面標(biāo)題設(shè)置、角色權(quán)限管理、頁面過渡效果,本文將總結(jié)如何使用 meta 屬性來實(shí)現(xiàn)這些常見的功能,感興趣的朋友一起看看吧2024-06-06
這篇文章主要介紹了詳解Vue This$Store總結(jié)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12
VueX 提供了一個(gè)全局都可以使用的數(shù)據(jù)管理倉庫，不用考慮父子傳值之類的問題，并且可以跨頁面?zhèn)鬟f數(shù)據(jù)，提高了可維護(hù)性，這篇文章主要介紹了Vue3 中的 Vue-Router 和 VueX,需要的朋友可以參考下2022-12-12
vue2從數(shù)據(jù)變化到視圖變化之nextTick使用詳解
這篇文章主要為大家介紹了vue2從數(shù)據(jù)變化到視圖變化之nextTick使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
vue組件之間通信方式實(shí)例總結(jié)【8種方式】
這篇文章主要介紹了vue組件之間通信方式,結(jié)合實(shí)例形式總結(jié)分析了vue.js的8種組件通信方式與相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-02-02