Question

如何在下面的mapMutations中使用命名空间？

   methods: {
    addTodo() {
      this.$store.commit('todos/addTodo', this.text)
      this.text = ''
    }
   }

我尝试过：

  methods: {
   ...mapMutations('todos', {
      addTodo () {
        this.$store.commit('addTodo', this.text)
        this.text = ''
      }
     })
   }

我收到此错误：

commons.app.js:19729 [vuex] unknown mutation type: addTodo

有什么想法吗？

Answer 1

这不适用于您的情况，因为您实际上并未映射任何突变，而是添加了一个函数，该函数从未知名称空间提交addTodo突变。改变中从this.$store.commit('addTodo', this.text)到this.$store.commit('todos/addTodo', this.text)可能会解决您的问题，但这仍然不是使用mapMutations的正确方法。 mapMutations应该可以让您导入您的突变，然后像其他任何方法一样调用它们。如果您想拥有其他逻辑，例如在示例中重置text属性，则必须用另一种方法包装提交，如下面的示例：

  methods: {
    ...mapMutations("todos", ["ADD_TODO"]),
    addTodo() {
      this.ADD_TODO(this.text);
      this.text = "";
    }
  }

或具有突变别名：

  methods: {
    ...mapMutations("todos", { addTodoMutation: 'ADD_TODO' }),
    addTodo() {
      this.addTodoMutation(this.text);
      this.text = "";
    }
  }

https://codesandbox.io/s/yvjvll56oj

Vuex-名称空间+ mapMutations +函数？

1 个答案: