• 在Vuex使用 以及 dispatch和commit来调用mutations的区别


    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);
                }
            }

    区别:

    dispatch:含有异步操作,例如向后台提交数据,写法: this.$store.dispatch('mutations方法名',值)

    commit:同步操作,写法:this.$store.commit('mutations方法名',值)

  • 相关阅读:
    关于input()
    HDU 3746
    HDU 4335 Contest 4
    HDU 4418 高斯消元法求概率DP
    HDU 4339 Contest 4
    HDU 4334 Contest 4
    HDU 4333 Contest 4
    HDU 4332 Contest 4
    HDU 4035
    HDU 4336
  • 原文地址:https://www.cnblogs.com/myRain/p/8259756.html
Copyright © 2020-2023  润新知