标签：传参 sub 04 mutations state Mutation step mapMutations methods

可以在触发mutations时传递参数

import { mapState, mapMutations } from 'vuex'


		//state仓库本身，step外界传进的参数
    addN(state, step) {
      state.count += step
    }


		<button @click="btnHandler2">+N</button>

		
    btnHandler2() {
    // commit的作用就是调用某个mutation函数
      this.$store.commit('addN', 3)
    },

this.$store.commit()是触发mutations的第一种方式

触发mutations的第二种方式：

1.从vuex中按需导入mapMutations函数

import { mapMutations } from 'vuex';

通过导入的mapMutations函数，将需要的mutations函数，映射为当前组件的methods方法：

2.将指定的mutations函数，映射为当前组件的methods函数

methods:{
	...mapMutations(['add','addN']);
}

 import { mapState, mapMutations } from 'vuex'

  methods: {
    ...mapMutations(['sub']),
    btnHandler1() {
      this.sub()
    },
  },
    
    
   sub(state){
      state.count--;
    }

<button @click="btnHandler1">-1</button>

	<button @click="btnHandler1">-1</button>
    <button @click="btnHandler2">-N</button>

import { mapState, mapMutations } from 'vuex'

	methods: {
    ...mapMutations(['sub', 'subN']),
    btnHandler1() {
      this.sub()
    },
    btnHandler2() {
      this.subN(3)
    },
  },
    
    sub(state) {
      state.count--
    },
    subN(state, step) {
      state.count -= step
    }

标签：传参,sub,04,mutations,state,Mutation,step,mapMutations,methods
来源： https://blog.csdn.net/baidu_30104991/article/details/112393938

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。