Vue.js
애플리케이션에 대한 상태 관리 패턴 + 라이브러리 prop
데이터 공유👉🏻 지나치게 중첩된 컴포넌트를 통과하는 prop
데이터는 장황할 수 있으며 형제 컴포넌트에서는 작동하지 않는다.
👉🏻 관련 컴포넌트 내 이벤트를 통해 공통 상태의 여러 복사본 변경 및 동기화 처리가 되어야 한다.
👉🏻 이러한 패턴은 유지보수가 불가능한 코드가 된다.
👉🏻 공통의 상태를 전역 싱글톤으로 관리한다.
👉🏻 모든 컴포넌트는 트리구조와 상관 없이 공통의 상태에 접근하거나 변경할 수 있다.
구분 | handler | 설명 |
---|---|---|
State | - | 변수 ( Vue객체의 data와 같은 개념 ) |
Getter | - | 계산된 속성 ( Vue객체의 computed와 같은 개념 ) |
Mutations | commit | State를 조작하는 함수 ( Vue객체의 methods와 같은 개념 ) |
Actions | dispatch | Mutations를 실행, 비동기처리 가능 |