본문 바로가기

Vue.js

(2)
MVVM 패턴 1.모델(Model) 2.View 3.View Model 뷰는 뷰 모델을 알지만, 뷰 모델은 뷰를 알지 못함. 뷰 모델은 모델을 알지만, 모델은 뷰 모델을 알지 못함. -> 뷰 모델과 모델이 뷰로부터 독립적인 형태 => UI로 부터 비즈니스 로직과 프레젠테이션 로직 분리 가능 1. View UI에 관련된 것 (애니메이션과 같은 UI 로직은 포함하되, 데이터 생성과 같은 비즈니스 로직은 포함 X) UI와 UI로직을 다룸 2. View Model 뷰가 사용한 베서드와 필드 구현 뷰에게 상태변화 알림 뷰모델과 모델은 일대다 관계 형성 뷰 모델은 뷰가 쉽게 사용할 수 있도록 모델의 데이터를 가공해서 뷰에게 제공 프레젠테이션로직과 뷰를 위한 상태를 다룸 3. Model 앱에서 사용할 데이터에 관련된 행외와 데이터..
vue의 상태관리 vuex 상태관리 여러 컴포넌트 간의 데이터 전달과 이벤트 통신을 한 곳에서 관리하는 패턴 Vue 상태관리 데이터를 단방향으로, 중앙집중적으로 관리 상태(state) 앱을 작동하는 data 뷰(view) 데이터를 받아 그려주는 vi 화면 액션(action) 사용자의 입력에 따라 반응적으로 데이터를 변경하는 method Vuex 여러 컴포넌트라도 쉽게 상호작용할 수 있게 돕는 라이브러리 state, muations, actions, getter 4가지 형태로 관리 관리 포인트는 store 라 불림 state 원본 소스 역할인 data, mutation을 통해서만 변경 가능 muations 유일하게 state를 변경할 방법, 메서드와 유사. commit을 통해서만 호출, 함수로 구현 API를 통해 전달 받은 데이터를..