vue中直接提交mutation的两种方式

最新推荐文章于 2025-06-11 15:05:01 发布

原创最新推荐文章于 2025-06-11 15:05:01 发布 · 4.4k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue #vuex #mutation #commit

vue2.x 专栏收录该内容

39 篇文章

订阅专栏

本文介绍如何在Vue项目中使用Vuex的mapMutations辅助函数，将组件方法映射为store.commit调用，简化状态管理操作。通过具体示例展示了如何利用mapMutations进行方法映射。

commit：提交可以在组件中使用 this.$store.commit('xxx') 提交 mutation，或者使用 mapMutations 辅助函数将组件中的 methods 映射为 store.commit 调用（需要在根节点注入 store）。

import { mapMutations } from 'vuex'
 
export default {
 
methods: {
 ...mapMutations([
  'increment' 
  // 映射 this.increment() 为 this.$store.commit('increment')
 ]),
 ...mapMutations({
  add: 'increment' 
  // 映射 this.add() 为 this.$store.commit('increment')
 })
}
}