• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

TodoInput.vue 에서 mapMutations 사용하기 질문

22.10.19 00:55 작성 조회수 362

1

 methods: {
   // ...mapMutations({addTodo:"addOneItem"}),
    addTodo() {
      if (this.newTodoItem !== "") {
        // this.$emit("addTodoItem", this.newTodoItem);
        this.$store.commit("addOneItem", this.newTodoItem);
        this.clearInput();
        this.$refs.fc.focus();
      } else {
        this.showModal = !this.showModal;
      }
    },
    clearInput() {
      this.newTodoItem = "";
    },
  },
  components: { Modal },
};

에서 "...mapMutations({addTodo:"addOneItem"})"
 로 스토어로 접근 할때 

<input
      type="text"
      v-model="newTodoItem"
      v-on:keyup.enter="addTodo"
      ref="fc"
    />

v-on:keyup.enter="addTodo(?)"에 인자값을 넘기는 부분이 없는데
...mapMutations({addTodo:"addOneItem"}), 이렇게 하면 파마미터 값을 어떻게 넘기나요?

그리고 기존에는 "this.$store.commit("addOneItem", this.newTodoItem);" 
이소스 호출 전 if문이 로직이 있고 호출 후에는 this.clearInput();
로직이 있는데 이건 mapMutations로 호출 할때 어떻게 처리를 하면 되나요?

답변 1

답변을 작성해보세요.

0

안녕하세요, 아래 처럼 하시면 인자 값이 암묵적으로 넘어갈 거예요.

v-on:keyup.enter="addTodo"

...mapMutations({addTodo:"addOneItem"})

 

요렇게 해보시고 mapMutations 없이 풀어서 쓰셔야 할 것 같습니다! :)