Vuex 빠르게 부수기..

VueX 란.. Vuex 라이브러리 무수히 많은 컴포넌트의 데이터를 관리하기 위한 상태 관리 패턴이자 라이브러리 React의 Flux 패턴에서 기인함 Vuex 등장 배경인 Flex 패턴 Flex 패턴 MVC 패턴의 복잡한 데이터 흐름 문제를 해결하는 개발 패턴 (A

npm install vuex --save - npmyarn add vuex - yarn다음과 같은 디렉토리 구조에서 폴더와 파일을 생성했습니다.src/store/store.jssrc/main.js

여러 컴포넌트 간에 공유할 데이터 - 상태state 값을 접근하는 속성이자 computed() 처럼 미리 연산된 값을 접근하는 속성store.js

state의 값을 변경 할 수 있는 유일한 방법이자 메소드mutation은 commit()으로 동작시킨다.store.jsApp.vuestate를 변경하기 위해 mustations를 동작시킬 때 인자payload 를 전달 할 수 있음위와 다른 점은 보내고 싶은 인자가 많

비동기 처리 로직을 선언하는 메소드이다. (비동기 로직을 담당하는 mutations)데이터 요청, Promise, ES6 async와 같은 비동기 처리는 모두 actions에 선언한다.언제 어느 컴포넌트에서 해당 state를 호출하고, 변경했는지 확인이 어려움위와 같이

state -> mapStategetters -> mapGettersmutations -> mapMutationsactions -> mapActionsApp.vueVuex에 선언한 state 속성을 뷰 컴포넌트에 더 쉽게 연결해주는 헬퍼 함수Vuex에 선언한 gette