FrontEnd/Vue.js

[Vue.js] MVVM

SambaLim 2019. 1. 13. 13:58
Vue - MVVM

Model-View-ViewModel

구성요소

  1. Model

모델(Model)은 실제 상태 내용 (객체 지향 접근법)을 나타내는 도메인 모델 또는 내용 (데이터 중심 접근법)을 나타내는 데이터 액세스 계층 을 나타냅니다.

  1. View

MVC 및 MVP 패턴의 뷰는 사용자가 화면에 무엇을보고의 구성, 레이아웃 및 모양이다. 모델의 표현을 표시하고 뷰 (클릭, 키보드, 제스처 등)와의 사용자 상호 작용을 수신하고, 데이터 바인딩 (속성, 이벤트 콜백, 이벤트 콜백 등을 통해 뷰 모델로 처리를 전달)을 정의 할 수 있습니다.

  1. ViewModel

뷰 모델(ViewModel)은 공용 속성과 명령을 보여주는 추상화입니다. MVC 패턴의 컨트롤러 또는 MVP 패턴의 표현 자 대신 MVVM에는 뷰 모델에서 뷰와 바운드 속성 간의 통신을 자동화 하는 바인더 가 있습니다. 뷰 모델은 모델의 데이터 상태로 설명됩니다. 뷰 모델과 MVP 패턴의 Presenter 간의 주요 차이점은 표현자가 뷰에 대한 참조를 가지지 만 뷰어에는 뷰에 대한 참조가 있다는 것입니다. 대신 뷰는 뷰 모델의 속성에 직접 바인딩되어 업데이트를 보내고받습니다. 효율적으로 작동하려면 바인딩 기술이 필요하거나 바인딩을 수행하는 상용구 코드가 필요합니다.

  1. Binder

선언적 데이터와 명령 바인딩은 MVVM 패턴에 내포되어 있습니다. 예를들어 Microsoft 솔루션 스택 에서 바인더는 XAML 이라는 마크 업 언어 입니다. 바인더 뷰 모델 뷰를 동기화 보일러 플레이트 로직을 작성해야만 했던 것을 자유롭게 해주었다. 마이크로 소프트 스택의 외부에 구현 된 경우, 선언적 데이터 바인딩 기술의 존재는,이 패턴을 가능하게 무엇및 결합제없이 하나 일반적 MVP 또는 MVC 대신 사용하고 더 상용구를 작성하는 것 (또는 다른 도구로 생성).

'FrontEnd > Vue.js' 카테고리의 다른 글

[Vue.js] Vue BootStrap CSS 넣기  (0) 2019.01.14
[Vue.js] Vue 시작하기  (0) 2019.01.13
[Vue.js] Vue 추천이유  (0) 2019.01.13