addTodo Helper 함수 적용

methods: {
...mapMutations(['addOneItem']),
addTodo() {
if(this.newTodoItem !== ''){
// this.$emit('addTodoItem', this.newTodoItem)
// this.$store.commit('addOneItem', this.newTodoItem);
this.addOneItem(this.newTodoItem)
this.clearInput();
} else {
this.showModal = !this.showModal;
}
},
clearInput() {
this.newTodoItem = "";
}
},

이렇게 수정해서 적용해보긴 했습니다만...
왠지 'mapMutations에 addTodo() 로직이 넘어가야 할 것만 같은 느낌이 드는데요. 그렇게 하려면 newTodoItem, showModal 모두 state에서 관리해야 하는 건지요?

그리고 mutation에 있어야 하는 로직과 각 component에 있어야 하는 로직을 구분해야 하는지, 아니면 되도록 mutation에 로직을 구현하도록 하는 것이 vuex를 적용해 개발할 때 더 적절한 개발 패턴인지 아직 감이 안 옵니다.

best practice나 가이드가 있다면 부탁드립니다.

감사합니다.