mvvm和mvc的區(qū)別:1、mvvm各部分的通信是雙向的,而mvc各部分通信是單向的。2、MVVM實現(xiàn)了view與model的自動同步,也就是model屬性改變時,不需要手動操作dom元素去改變view的顯示,而是改變屬性后該屬性對應的view層會自動改變。
本教程操作環(huán)境:windows7系統(tǒng)、vue3版,DELL G3電腦。
MVC是什么
MVC是一種設(shè)計模式:
M(Model):模型層。是應用程序中用于處理應用程序數(shù)據(jù)邏輯的部分,模型對象負責在數(shù)據(jù)庫中存取數(shù)據(jù);
V(View):視圖層。是應用程序中處理數(shù)據(jù)顯示的部分,視圖是依據(jù)模型數(shù)據(jù)創(chuàng)建的;
C(Controller):控制層。是應用程序中處理用戶交互的部分,控制器接受用戶的輸入并調(diào)用模型和視圖去完成用戶的需求,控制器本身不輸出任何東西和做任何處理。它只是接收請求并決定調(diào)用哪個模型構(gòu)件去處理請求,然后再確定用哪個視圖來顯示返回的數(shù)據(jù)。
MVVM是什么
vue框架中MVVM的M就是后端的數(shù)據(jù),V就是節(jié)點樹,VM就是new出來的那個Vue({})對象
M(Model):模型層。就是業(yè)務邏輯相關(guān)的數(shù)據(jù)對象,通常從數(shù)據(jù)庫映射而來,我們可以說是與數(shù)據(jù)庫對應的model。
V(View):視圖層。就是展現(xiàn)出來的用戶界面。
VM(ViewModel):視圖模型層。連接view和model的橋梁。因為,Model層中的數(shù)據(jù)往往是不能直接跟View中的控件一一對應上的,所以,需要再定義一個數(shù)據(jù)對象專門對應view上的控件。而ViewModel的職責就是把model對象封裝成可以顯示和接受輸入的界面數(shù)據(jù)對象。
View與ViewModel之間通過雙向綁定建立聯(lián)系,這樣當View(視圖層)變化時,會自動更新到ViewModel(視圖模型),反之亦然。
MVVM的優(yōu)勢
1、mvc和mvvm都是一種設(shè)計思想。 主要就是mvc中Controller演變成mvvm中的viewModel。 mvvm主要解決了mvc中大量DOM操作使頁面渲染性能降低,加載速度變慢的問題 。
2、MVVM與MVC最大的區(qū)別就是:它實現(xiàn)了View和Model的自動同步:當Model的屬性改變時,我們不用再自己手動操作Dom元素來改變View的顯示,它會自動變化。
3、整體看來,MVVM比MVC精簡很多,我們不用再用選擇器頻繁地操作DOM。
MVVM并不是用VM完全取代了C,ViewModel存在目的在于抽離Controller中展示的業(yè)務邏輯,而不是替代Controller,其它視圖操作業(yè)務等還是應該放在Controller中實現(xiàn)。
MVC與MVVM有什么區(qū)別
區(qū)別一:
mvvm各部分的通信是雙向的,而mvc各部分通信是單向的。
區(qū)別二:
MVVM 與 MVC 最大的區(qū)別就是:它實現(xiàn)了View和Model的自動同步
-
當Model屬性改變時,不用手動操作Dom元素去改變View的顯示。
-
而改變屬性后,該屬性對應View的顯示會自動改變
MVVM響應式原理
- vue是采用數(shù)據(jù)劫持配合發(fā)布者-訂閱者的模式的方式,
- 通過Object.defineProperty()來劫持各個屬性的getter和setter,
- 在數(shù)據(jù)變動時,發(fā)布消息給依賴收集器(dep中的subs),去通知(notify)觀察者,做出對應的回調(diào)函數(shù),更新視圖
- MVVM作為綁定的入口,整合Observer,Compile和Watcher三者,
- 通過Observer來監(jiān)聽model數(shù)據(jù)變化,
- 通過Compile來解析編譯模板指令,
- 最終利用Watcher搭起Observer,Compile之間的通信橋路,
- 達到數(shù)據(jù)變化Observer)=>視圖更新;視圖交互變化=>數(shù)據(jù)model變更的雙向綁定效果。
【