Vuex 기술요소 mutations와 commit() 형식

return 값을 보면state로 부르면 되지않나 싶지만 다 쓸모가 있다

 

아 아래부분에 변경하는 부분이 있구나.. 이렇게 접근해서 변경하는구나..

 

this.$store.commit(함수명,인자)를 넘겨서 사용할 수 있구만..

 

인프런- vue.js 켑틴판교 강의

 

인자를 여러개 보내고 싶으면 저렇게 보내면 된다.

payload라는 매개변수로 정의했는데 아마도 법칙이 아닐까 싶다.

아 관행적으로 하는 것이 맞다고 강의에서 말한다. 바꿔도 되지만 통상적으로 사용하는 매개변수 명임..

 

 

실제로 이렇게 store.js에 작성했다.

export const store = createStore({
    state: {
        todoItems : storage.item()
    },
    mutations : {
        addOneItem(state,todoItem){
            var obj = {completed : false , item : todoItem};
            localStorage.setItem(todoItem,JSON.stringify(obj));
            state.todoItems.push(obj);
        }
    }
})

export default {
    data(){
        return{
            newTodoItem : "",
            showModal : false
        }

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

this.$store.commit();으로 mutations에 접근해서 함수와 인자를 보냈다.