????：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>在頁(yè)面渲染方式 上MVVM與傳統(tǒng)的MVC模式相比有哪些優(yōu)勢(shì)</title> </head> <body> <h2>在頁(yè)面渲染方式 上MVVM與傳統(tǒng)的MVC模式相比有哪些優(yōu)勢(shì)</h2> <div> <p></p> <p> 1.MVC </p> <p> a.MVC:是Model-View-Controller的縮寫;</p> <p> b.M:Model,模型,主要處理與數(shù)據(jù)庫(kù)相關(guān)的業(yè)務(wù)邏輯;</p> <p> V:View,視圖,主要負(fù)責(zé)數(shù)據(jù)在客戶端/瀏覽器上的展示; </p> <p> C:Controller:控制器,視圖與模型之間傳遞消息,例如接受請(qǐng)求,選擇模型,渲染視圖等; </p> <p> c.MVC基本的運(yùn)行流程是: </p> <p> 1. 視圖發(fā)起請(qǐng)求-->控制器接收請(qǐng)求-->轉(zhuǎn)發(fā)給對(duì)應(yīng)模型處理-->模型將結(jié)果返回到控制器-->控制器返回到視圖; </p> <p> 2. 簡(jiǎn)單描述: View-->Controller-->Model-->Controller-->View, 即 V-C-M-C-V; </p> <p> 3. 整個(gè)過(guò)程是封閉的,單向的,視圖與模型之間不允許直接直接通訊,必須通過(guò)控制器進(jìn)行; </p> <p> d. MVC開發(fā)的基本原則: </p> <p> 1. 需要服務(wù)器端配合,模型Model與控制器Controller都在服務(wù)器端完成; </p> <p> 2. 服務(wù)器處理過(guò)的數(shù)據(jù),必須通過(guò)JavaScript在前端進(jìn)行渲染; </p> <p> 2. '厚模型,薄控制器',業(yè)務(wù)邏輯盡可能寫到模型中,控制器僅調(diào)用模型提供的接口即可; </p> <p> 2.MVVM: </p> <p> a.隨著前端頁(yè)面開發(fā)越來(lái)越復(fù)雜,用戶與數(shù)據(jù)的交互也越來(lái)越頻繁,而很多交互都是臨時(shí)性的,沒有必要每一次都要 和服務(wù)器中的模型對(duì)象進(jìn)行交互,但是傳統(tǒng)的jQuery等函數(shù)庫(kù)又力不從心,這時(shí)MVVM模型就應(yīng)運(yùn)而生啦。 </p> <p> b.MVVM: 是Model-View-ViewModel的縮寫; </p> <p> M:Model層, V:View層, VM: ViewModel層; </p> <p> c.Model:JavaScript對(duì)象/模型, View:HTML代碼/模板,各司其職,完全分離 </p> <p> d.VM層:負(fù)責(zé)Model與View之間的交互,完全使用JavaScript進(jìn)行編寫; </p> <p> e.基本流程: VM層根據(jù)Model數(shù)據(jù)來(lái)更新View,或者根據(jù)View來(lái)更新Model,這個(gè)過(guò)程是雙向的,即雙向數(shù)據(jù)綁定; </p> <p> f.服務(wù)器端只負(fù)責(zé)更新Model即可,而Model就是一個(gè)JavaScript對(duì)象,所以服務(wù)器只需要返回可被Model解析的 數(shù)據(jù)即可,例如:json,html等,這樣就完全實(shí)現(xiàn)了面向接口/API編程。 </p> <p> g.Vue.js就是一個(gè)完全采用了MVVM機(jī)制的前端開發(fā)框架,采用從底層向上的漸進(jìn)式開發(fā)思想,易學(xué)易用! </p> <p> 3. MVVM 的優(yōu)點(diǎn) </p> <p> a.MVVM 兼容 MVC，可以先創(chuàng)建一個(gè)簡(jiǎn)單的 View Model，再慢慢遷移。 </p> <p> b.MVVM 使得 app 更容易測(cè)試，因?yàn)?nbsp;View Model 部分不涉及 UI。 </p> <p> c.MVVM 雙向綁定技術(shù)，當(dāng)Model變化時(shí)，View-Model會(huì)自動(dòng)更新，View也會(huì)自動(dòng)變化。很好的做到數(shù)據(jù)的一致性 </p> </div>
?? ???：查無(wú)此人?? ??：2019-05-20 09:19:38
???? ??：完成的不錯(cuò)。編程有很多設(shè)計(jì)模式，多了解，對(duì)以后工作幫助很大。繼續(xù)加油。