欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

在Vuex使用dispatch和commit來調(diào)用mutations的區(qū)別詳解

 更新時間：2018年09月18日 08:51:05   作者：東邊的小山  
今天小編就為大家分享一篇在Vuex使用dispatch和commit來調(diào)用mutations的區(qū)別詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

main.js中

import Vuex from 'vuex'
Vue.use(vuex);
const store = new Vuex.store({
　　state: {
　　　　nickName: "",
　　　　cartCount: 0　　
　　},
　　mutations: {
　　　　updateUserInfo(state,nickName) {
　　　　　　state.nickName = nickName;
　　　　},
　　　　updateCartCount(state,cartCount) {
　　　　　　state.cartCount += cartCount;
　　　　}
　　},
 actions: {
 updateUserInfo(context) {
  context.commit("updateUserInfo");
 },
 updateCartCount(context) {
  context.commit("updateCartCount");
 }
 }
})
new Vue({
　　el: "#app",
　　store,
　　router,
　　template: '<App/>',
　　components: {App}
})

組件中：

methods: {
  increment(){
  this.$store.dispatch("updateUserInfo", 'nick'); //this.$store.commit("increment", 'nick');
  },
  decrement() {
  this.$store.dispatch("updateCartCount", 1); // this.$store.commit("decrement", 1);
  }
 }

區(qū)別：

dispatch：含有異步操作，例如向后臺提交數(shù)據(jù)，寫法： this.$store.dispatch('mutations方法名',值)

commit：同步操作，寫法：this.$store.commit('mutations方法名',值)

以上這篇在Vuex使用dispatch和commit來調(diào)用mutations的區(qū)別詳解就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

  • 基于Vue3實(shí)現(xiàn)無限滾動組件的示例代碼

    基于Vue3實(shí)現(xiàn)無限滾動組件的示例代碼

    如果你在社交媒體上停留的時間過長，那么，你所在的網(wǎng)站很可能正在使用無限滾動組件。這篇文章教你利用Vue3實(shí)現(xiàn)無限滾動組件，感興趣的可以參考一下
    2022-09-09
  • vue的自定義指令傳參方式

    vue的自定義指令傳參方式

    這篇文章主要介紹了vue的自定義指令傳參方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
    2022-05-05
  • Vue使用自定義指令實(shí)現(xiàn)頁面底部加水印

    Vue使用自定義指令實(shí)現(xiàn)頁面底部加水印

    本文主要實(shí)現(xiàn)給項目的整個背景加上自定義水印，可以改變水印的文案和字體顏色等，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2021-06-06
  • vue自定義指令的創(chuàng)建和使用方法實(shí)例分析

    vue自定義指令的創(chuàng)建和使用方法實(shí)例分析

    這篇文章主要介紹了vue自定義指令的創(chuàng)建和使用方法,結(jié)合完整實(shí)例形式分析了vue.js創(chuàng)建及使用自定義指令的相關(guān)操作技巧與注意事項,需要的朋友可以參考下
    2018-12-12
  • vue封裝tree組件實(shí)現(xiàn)搜索功能

    vue封裝tree組件實(shí)現(xiàn)搜索功能

    本文主要介紹了vue封裝tree組件實(shí)現(xiàn)搜索功能，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2023-05-05
  • vue組件component的注冊與使用詳解

    vue組件component的注冊與使用詳解

    組件是Vue是一個可以重復(fù)使用的Vue實(shí)例, 它擁有獨(dú)一無二的組件名稱,它可以擴(kuò)展HTML元素,以組件名稱的方式作為自定義的HTML標(biāo)簽，這篇文章主要介紹了vue組件component的注冊與使用,需要的朋友可以參考下
    2022-08-08
  • vue3+ts項目之安裝eslint、prettier和sass的詳細(xì)過程

    vue3+ts項目之安裝eslint、prettier和sass的詳細(xì)過程

    這篇文章主要介紹了vue3+ts項目02-安裝eslint、prettier和sass的詳細(xì)過程,在本文講解中需要注意執(zhí)行yarn format會自動格式化css、js、html、json還有markdown代碼，需要的朋友可以參考下
    2023-10-10
  • Vue中使用flv.js播放視頻的示例詳解

    Vue中使用flv.js播放視頻的示例詳解

    這篇文章主要為大家詳細(xì)介紹了如何在Vue項目中使用flv.js播放視頻,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
    2024-04-04
  • 基于vue+openlayer實(shí)現(xiàn)地圖聚合和撒點(diǎn)效果

    基于vue+openlayer實(shí)現(xiàn)地圖聚合和撒點(diǎn)效果

    Openlayers 是一個模塊化、高性能并且功能豐富的WebGIS客戶端的JavaScript包，用于顯示地圖及空間數(shù)據(jù)，并與之進(jìn)行交互，具有靈活的擴(kuò)展機(jī)制，本文給大家介紹vue+openlayer實(shí)現(xiàn)地圖聚合效果和撒點(diǎn)效果，感興趣的朋友一起看看吧
    2021-09-09
  • VUE搭建分布式醫(yī)療掛號系統(tǒng)的前臺預(yù)約掛號步驟詳情

    VUE搭建分布式醫(yī)療掛號系統(tǒng)的前臺預(yù)約掛號步驟詳情

    這篇文章主要介紹了VUE搭建分布式醫(yī)療掛號系統(tǒng)的前臺預(yù)約掛號步驟詳情，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2022-04-04

最新評論