vuex中store的action和mutations用法
更新時間：2022年04月12日 11:40:37 作者：zb0002011
這篇文章主要介紹了vuex中store的action和mutations用法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
action和mutations (this.$store.dispatch和this.$store.commit)區(qū)別
都是調用vuex中的方法。一個異步一個同步
dispatch：含有異步操作，例如向后臺提交數據，寫法： this.$store.dispatch('action方法名',值)commit：同步操作，寫法：this.$store.commit('mutations方法名',值)
action:
1、用于通過提交mutation改變數據
2、會默認將自身封裝為一個Promise
3、可以包含任意的異步操作
mutations:
1、通過提交commit改變數據
2、只是一個單純的函數
3、不要使用異步操作，異步操作會導致變量不能追蹤。也就是說，用action中的函數調用mutations中的函數，進行異步操作state中的數據
用法
dispatch: 含有異步操作
存儲：
this.$store.dispatch('initUserInfo',friend);取值：
this.$store.getters.userInfo;
commit:同步操作
存儲：
this.$store.commit('initUserInfo',friend);取值：
this.$store.state.userInfo;
實例
1、login.vue
2、user.js
3、login.js
action和mutation分別用來處理什么？
action處理異步數據最終提交到數據庫mutation用來同步數據做業(yè)務的處理 (vuex中store數據改變唯一的方法就是mutation)Action提交的是 mutation，而不是直接變更狀態(tài)。
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
vue使用自定義事件的表單輸入組件用法詳解【日期組件與貨幣組件】
這篇文章主要介紹了vue使用自定義事件的表單輸入組件用法,結合實例形式詳細分析了vue.js日期組件與貨幣組件相關操作技巧及注意事項,需要的朋友可以參考下2020-06-06
這篇文章主要介紹了vant van-list下拉加載更多onload事件問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-01-01
我在做一個調用虛擬機錄屏的一個操作,需要在瀏覽器頁面上,點擊按鈕后,關閉當前頁面里的某一個頁面,并且打開瀏覽器新頁面是虛擬機的頁面,本文給大家介紹vue 跳轉到其他頁面并關閉當前頁面的實現(xiàn)代碼,感興趣的朋友一起看看吧2023-09-09
這篇文章主要介紹了vue使用高德地圖根據坐標定位點的實現(xiàn)代碼,代碼簡單易懂，非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2019-08-08
這篇文章主要給大家介紹了關于vue點擊按鈕跳轉到另一個vue頁面的相關資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-08-08
這篇文章主要介紹了從0到1搭建Element的后臺框架的方法步驟，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
這篇文章主要為大家詳細介紹了vue實現(xiàn)文字滾動效果，公告滾動播放，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要介紹了vue?@tap事件之$event用法介紹，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
Vue3項目中優(yōu)雅實現(xiàn)微信授權登錄的方法
用戶在微信端中訪問第三方網頁,可以通過微信網頁授權機制獲取用戶的基本信息,進而實現(xiàn)所需要的業(yè)務邏輯,這篇文章主要給大家介紹了關于Vue3項目中優(yōu)雅實現(xiàn)微信授權登錄的相關資料,需要的朋友可以參考下2021-09-09
這篇文章主要為大家詳細介紹了vue實現(xiàn)鼠標經過顯示懸浮框效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03