태태코딩

mapMutationsvuex는 state , getter, mutation, actions 로 나뉜다. 앞서 state를 쉽게 mapState를 통해 가져오는 것을 보았으니, 이번에는 Mutation를 가져오는 방법을 봐보겠다.  import { mapMutations, mapState } from 'vuex'; methods:{ ...mapMutations(['addOneItem']), // Vuex mutation 매핑 addTodo() { if (this.newTodoItem !== '') { this.addOneItem(this.newTodoItem); // Vuex mutation 호출 this.clearInput(); // 입력 필드 초기화 ..

VUE *vuex = 복잡한 애플리케이션의 컴포넌트들을 단순하게 관리할 수 있다.* ->  flux 패턴으로 복잡한 애플리케이션의 문제점들을 해결하고 있었다.그렇기 때문에vue의 리엑티비티와 flux를 공존할 수 있게 하는 방법을 만들어냈다. Vuex정의: 무수히 많은 컴포넌트의 데이터를 관리하기 위한 상태 관리 패턴이자 라이브러리.React의 Flux 패턴에서 기인함. (앱이 커졌을 때 효과적으로 관리할 수 있는 방법)  Vuex 라이브러리중 state(data),getters(computed),mutations( method ), actions(비동기 method) 를 학습하겠다.Vuex를 더 쉽게 코딩할 수 있는 Helper기능이있다.  FluxMVC 패턴의 복잡한 데이터 흐름 문제를 해결하는 개발..

기본 컴포넌트   Todo App을 관리하기 위하여 각각 Input부분과 List부분에 배열을 넣어주어 localStorage에 저장하는 코드로 작성을 해보았다. 문제점이 바로바로 로딩이 안된다는 것이였다. 그렇기 때문에 배열을App.vue에  놓아두고 Input과 List의 기능들이 emit을 통해서 이벤트를 일으키면 그에 맞게 localStorage를 변형시키고 ,App.vue 에 있는 배열을 즉각 갱신하여 이 단점을 보완했다.