本文關(guān)鍵詞：基于MVVM的Web前端響應(yīng)式框架的研究與集成

  更多相關(guān)文章： MVVM 前端框架 框架集成

【摘要】：相較于Web1.0時(shí)代網(wǎng)頁由單純的文字和圖片構(gòu)成,Web2.0時(shí)代網(wǎng)頁的布局有了更大的改變。以富媒體元素為主的網(wǎng)頁形式更加生動(dòng),與此同時(shí),Web前端技術(shù)也在應(yīng)用開發(fā)過程中得到更廣泛的使用。至此,新的交互形式不僅增強(qiáng)了用戶體驗(yàn),也迎合了大眾發(fā)展的潮流。眾所周知,互聯(lián)網(wǎng)前端開發(fā)技術(shù)的特點(diǎn)是具有高可重用性、與后臺(tái)技術(shù)獨(dú)立,通過研究表明采用開發(fā)框架實(shí)現(xiàn)前端代碼的重用性是當(dāng)前較為廣泛且可行的技術(shù)手段。本文運(yùn)用Html5、CSS3、Java Script、Ajax等前端技術(shù),采取理論和實(shí)踐相結(jié)合的研究思路,實(shí)現(xiàn)了基于MVVM模式的前端框架。其具體研究過程及方法可歸納為以下幾點(diǎn)：首先,廣泛閱讀相關(guān)文獻(xiàn),研究MVC、MVP、MVVM等不同的模式在前端框架方面的需求,由于應(yīng)用系統(tǒng)愈發(fā)復(fù)雜,對(duì)各模塊的復(fù)用已經(jīng)無法滿足開發(fā)需求,因而就形成了針對(duì)特定領(lǐng)域的框架開發(fā)。其次,設(shè)計(jì)一個(gè)基于MVVM模式高效的Web前端開發(fā)框架,可以使前端模塊化變高、復(fù)用性變的更好,從而使模塊內(nèi)層次、功能更加分明,設(shè)計(jì)運(yùn)行更加合理。最后,該框架將各種技術(shù)元素的研究與開發(fā)整合起來,隨后將多個(gè)獨(dú)立的框架以最優(yōu)方式組合成連貫的系統(tǒng)。在Web2.0時(shí)代,Web開發(fā)人員更注重用戶體驗(yàn)度的提升,而當(dāng)今最為主流的手段是通過Ajax來達(dá)到這一目的。Ajax可以通過改造其視圖層結(jié)構(gòu),實(shí)現(xiàn)動(dòng)態(tài)頁面的相關(guān)操作,以最大化的滿足用戶體驗(yàn)。然后專門給出前端框架集成的方法以及實(shí)例。
【關(guān)鍵詞】：MVVM 前端框架 框架集成
【學(xué)位授予單位】：云南大學(xué)
【學(xué)位級(jí)別】：碩士
【學(xué)位授予年份】：2016
【分類號(hào)】：TP393.09
【目錄】：

• 中文摘要3-4
• Abstract4-10
• 第一章 緒論10-15
• 1.1 研究背景及意義10-11
• 1.2 國(guó)內(nèi)外研究現(xiàn)狀11-13
• 1.2.1 國(guó)外前端開發(fā)現(xiàn)狀11-12
• 1.2.2 國(guó)內(nèi)前端開發(fā)現(xiàn)狀12-13
• 1.3 本文研究?jī)?nèi)容13-14
• 1.4 論文組織結(jié)構(gòu)14-15
• 第二章 背景知識(shí)介紹15-23
• 2.1 前端基本技術(shù)15-16
• 2.1.1 HTML515
• 2.1.2 CSS315
• 2.1.3 JavaScript15-16
• 2.2 Web新技術(shù)16-17
• 2.2.1 Ajax16
• 2.2.2 前端優(yōu)化技術(shù)16-17
• 2.3 響應(yīng)式Web設(shè)計(jì)17-19
• 2.4 模塊化設(shè)計(jì)思想19
• 2.5 MVVM模式19-22
• 2.6 模式與框架的關(guān)系22-23
• 第三章 前端開發(fā)框架分析23-28
• 3.1 功能性需求23-26
• 3.1.1 框架功能模塊24-25
• 3.1.1.1 控制模塊24-25
• 3.1.1.2 通用模塊25
• 3.1.2 開發(fā)組件功能模塊25-26
• 3.1.2.1 布局模版25
• 3.1.2.2 前端樣式庫25
• 3.1.2.3 JavaScript組件25-26
• 3.2 非功能性需求26-28
• 3.2.1 User Experience26
• 3.2.2 開發(fā)規(guī)范26-28
• 第四章 前端開發(fā)框架設(shè)計(jì)28-53
• 4.1 前端框架的總體規(guī)劃28-29
• 4.1.1 框架邊界28-29
• 4.2 架構(gòu)設(shè)計(jì)29-50
• 4.2.1 View層30-34
• 4.2.1.1 Template技術(shù)31
• 4.2.1.2 UI控件31-33
• 4.2.1.3 虛擬DOM技術(shù)33-34
• 4.2.2 Model層34-37
• 4.2.2.1 Getter和Setter35-36
• 4.2.2.2 Context上下文管理器36
• 4.2.2.3 Model數(shù)據(jù)模型36
• 4.2.2.4 Requester請(qǐng)求管理器36-37
• 4.2.3 ViewModel層37-45
• 4.2.3.1 組件化38-41
• 4.2.3.2 路由41-45
• 4.2.4 MVVM的依賴關(guān)系45-50
• 4.2.4.1 數(shù)據(jù)綁定45-48
• 4.2.4.2 命令48-49
• 4.2.4.3 數(shù)據(jù)驗(yàn)證和錯(cuò)誤報(bào)告49-50
• 4.3 前端框架類圖50-51
• 4.4 基于MVVM的前端結(jié)構(gòu)51-53
• 第五章 開發(fā)框架集成53-64
• 5.1 軟件復(fù)用技術(shù)53
• 5.2 軟件復(fù)用與框架53-54
• 5.3 Web應(yīng)用開發(fā)集成框架54-56
• 5.4 前端框架集成56-64
• 5.4.1 界面設(shè)計(jì)的原則57-58
• 5.4.1.1 界面設(shè)計(jì)一般交互原則57
• 5.4.1.2 界面設(shè)計(jì)信息顯示原則57-58
• 5.4.1.3 界面設(shè)計(jì)數(shù)據(jù)的輸入原則58
• 5.4.2 前端框架集成方案58-62
• 5.4.2.1 創(chuàng)建JS Bundling58-60
• 5.4.2.2 創(chuàng)建CSS Bundling60-62
• 5.4.3 前端框架集成實(shí)例62-64
• 第六章 總結(jié)與展望64-66
• 6.1 論文總結(jié)64-65
• 6.2 展望65-66
• 參考文獻(xiàn)66-69
• 致謝69

，

本文編號(hào)：934136