解秀萍 鄭秀春 牛紅霞 石家莊信息工程職業(yè)學(xué)院

眾所周知，現(xiàn)在的用戶(hù)群對(duì)Web 前端的使用體驗(yàn)需求逐漸提升，這就使得web 前端開(kāi)發(fā)的工作量隨之增加了很多，代碼量持續(xù)遞增，開(kāi)發(fā)難度也越來(lái)越大?；诖饲闆r，為了進(jìn)一步提升代碼復(fù)用率和開(kāi)發(fā)效率，網(wǎng)頁(yè)開(kāi)發(fā)框架開(kāi)始受到了更高關(guān)注。vue 前端開(kāi)發(fā)技術(shù)便誕生在這樣的背景之下，其是建立在MVVM 架構(gòu)模式基礎(chǔ)上的一種技術(shù)類(lèi)型。是當(dāng)前非常流行的Web 前端開(kāi)發(fā)技術(shù)之一。輕量級(jí)響應(yīng)式框架vue 的出現(xiàn)和應(yīng)用，不僅有效簡(jiǎn)化了Web 前端開(kāi)發(fā)流程，降低開(kāi)發(fā)難度，提高開(kāi)發(fā)效率，而且實(shí)現(xiàn)了Web 系統(tǒng)前、后端開(kāi)發(fā)完全分離，全面提高了系統(tǒng)的靈活性和可擴(kuò)展性，其也為當(dāng)前高校Web 前端開(kāi)發(fā)課程教學(xué)模式的創(chuàng)新與改革提供了一個(gè)全新的發(fā)展思路。以下是筆者結(jié)合自己近兩年相關(guān)工作經(jīng)驗(yàn)，就此議題的相關(guān)內(nèi)容提出自己的幾點(diǎn)看法和建議。

一、關(guān)于vue 的簡(jiǎn)要介紹

為進(jìn)一步提高開(kāi)發(fā)效率，近些年我國(guó)相關(guān)專(zhuān)業(yè)領(lǐng)域一直都在不斷加大對(duì)Web 前端基于框架的開(kāi)發(fā)力度，其中，vue 便屬于最為理想的框架之一。vue 與其他框架不同，其屬于構(gòu)建用戶(hù)界面的漸進(jìn)式框架，采用的設(shè)計(jì)方式是自底向上增量開(kāi)發(fā)的理念，其擁有著更強(qiáng)的開(kāi)放性和靈活性，而且vue 的框架結(jié)構(gòu)與其他積累框架相比也要更加簡(jiǎn)單一些。vue 的優(yōu)勢(shì)主要體現(xiàn)在兩點(diǎn)：其一，vue 有助于開(kāi)發(fā)人員快速掌握和使用。其二，vue 可以更加便捷高效地與既有項(xiàng)目或者第三方庫(kù)實(shí)現(xiàn)整合。第三，當(dāng)與現(xiàn)代化的工具鏈以及各種支持類(lèi)庫(kù)結(jié)合使用時(shí)，vue 也完全能夠?yàn)閺?fù)雜的單頁(yè)應(yīng)用提供驅(qū)動(dòng)。

關(guān)于vue 的運(yùn)行原理，在介紹vue 的運(yùn)行原理之前，筆者在這里要介紹三個(gè)概念，分 別 是Observer、Compile 和Watcher。首先，關(guān)于Observer，Observer 是數(shù)據(jù)監(jiān)聽(tīng)器，因此它的作用和價(jià)值便是監(jiān)聽(tīng)數(shù)據(jù)，但是它的獨(dú)特之處就在于其可以對(duì)數(shù)據(jù)對(duì)象當(dāng)中的全部屬性進(jìn)行監(jiān)聽(tīng)，并且會(huì)告知訂閱者哪些數(shù)據(jù)的屬性發(fā)生了什么樣的變化。其次，關(guān)于Compile，Compile 是指令解析器，Compile 的功能和價(jià)值在于掃描vue 中的指令，并且會(huì)對(duì)掃描后得到的指令進(jìn)行解析和編譯。還有，關(guān)于Watcher，Watcher 更像是一個(gè)協(xié)調(diào)者，協(xié)調(diào)Observer 和Compile，在Observer 和Compile 之間建立起連接，接收來(lái)自O(shè)bserver 的屬性變化通知，發(fā)揮自身的協(xié)調(diào)調(diào)度功能，并執(zhí)行指令綁定的響應(yīng)回調(diào)函數(shù)。

vue 創(chuàng)建對(duì)象的流程是：第一，為選定對(duì)象進(jìn)行初始化，初始化的過(guò)程當(dāng)中，Observer 會(huì)持續(xù)對(duì)選定對(duì)象的屬性進(jìn)行監(jiān)聽(tīng)，與此同時(shí)，Compile 會(huì)對(duì)web頁(yè)面中的指令進(jìn)行掃描，并且對(duì)掃描后的指令進(jìn)行編譯，Watcher 則會(huì)在Dep 中添加一個(gè)閱讀者。第二，在系統(tǒng)運(yùn)行過(guò)程中，Observer 會(huì)獲取屬性變化并且通知Dep，在Dep 中查找與該屬性對(duì)象對(duì)應(yīng)的訂閱者，并向添加該訂閱者的Watcher 發(fā)送變化通知，從而對(duì)視圖進(jìn)行相應(yīng)的更新。

二、基于vue 的WEB 前端開(kāi)發(fā)課程教學(xué)模式分析

（一）構(gòu)建完善的課程知識(shí)結(jié)構(gòu)

根據(jù)筆者的調(diào)查和了解，發(fā)現(xiàn)當(dāng)前有一部分高校在該課程領(lǐng)域的知識(shí)結(jié)構(gòu)方面安排并不是很合理，其并沒(méi)有認(rèn)識(shí)到界面設(shè)計(jì)和代碼設(shè)計(jì)二者是同等重要的，在實(shí)際教學(xué)中存在著明顯的傾向性教學(xué)，或傾向于界面設(shè)計(jì)，或傾向于代碼設(shè)計(jì)。在web 前端開(kāi)發(fā)技術(shù)不斷創(chuàng)新與升級(jí)的背景下，高校需要結(jié)合現(xiàn)實(shí)發(fā)展需求和學(xué)校自身情況來(lái)重新構(gòu)建起課程知識(shí)結(jié)構(gòu)，將vue 這一開(kāi)發(fā)技術(shù)的理論和實(shí)踐教學(xué)融入課程知識(shí)結(jié)構(gòu)體系當(dāng)中來(lái)，為學(xué)生們提供更多學(xué)習(xí)、了解和應(yīng)用vue 技術(shù)的機(jī)會(huì)，其對(duì)于相關(guān)專(zhuān)業(yè)學(xué)生未來(lái)步入相應(yīng)崗位后實(shí)際工作的開(kāi)展也會(huì)有著非常大的幫助。除此之外，高校一定要在綜合考量各方面因素之后再進(jìn)行課程知識(shí)結(jié)構(gòu)的調(diào)整，要充分考慮到實(shí)際崗位的需求變化、學(xué)校課程教學(xué)的實(shí)際情況以及當(dāng)代學(xué)生群體的認(rèn)知和學(xué)習(xí)規(guī)律等等，進(jìn)而更好的確保課程知識(shí)結(jié)構(gòu)的合理性與系統(tǒng)性。

（二）追求教學(xué)方式的多元化

之前高校在web 前端開(kāi)發(fā)課程教學(xué)工作當(dāng)中，主要采用的教學(xué)方式有案例教學(xué)法、問(wèn)題驅(qū)動(dòng)型教學(xué)法等等，這些教學(xué)方式雖然也呈現(xiàn)出比較理想的教學(xué)效果，但是，其并不能夠完全滿足當(dāng)下web 前端開(kāi)發(fā)課程教學(xué)的需求變化?；诖饲闆r，高校在該課程教學(xué)工作當(dāng)中應(yīng)該積極創(chuàng)新和應(yīng)用更具新穎性和高效性的教學(xué)方式，要將網(wǎng)頁(yè)設(shè)計(jì)與制作中所涉及的關(guān)鍵技術(shù)和知識(shí)點(diǎn)更多的融入實(shí)際教學(xué)當(dāng)中來(lái)。基于vue 的web 前端開(kāi)發(fā)課程教學(xué)模式，筆者建議高職院?？梢远鄳?yīng)用慕課、微課等方式來(lái)進(jìn)行教學(xué)，將vue 的相關(guān)知識(shí)制作成為精簡(jiǎn)的小視頻，將其放置到網(wǎng)絡(luò)平臺(tái)上面供學(xué)生們學(xué)習(xí)和了解，更好地學(xué)習(xí)vue 的操作技巧，了解vue 的運(yùn)行原理，了解vue 在當(dāng)前web 前端開(kāi)發(fā)領(lǐng)域中發(fā)揮著什么樣的重要作用和價(jià)值。

三、結(jié)束語(yǔ)

綜上所述，Web 前端開(kāi)發(fā)課程是當(dāng)前高職院校計(jì)算機(jī)應(yīng)用技術(shù)、軟件工程等相關(guān)專(zhuān)業(yè)中的一門(mén)重要課程，該課程教學(xué)意在引導(dǎo)學(xué)生們學(xué)習(xí)和了解當(dāng)今社會(huì)中最具先進(jìn)性的Web 前端開(kāi)發(fā)技術(shù)，并且能夠?qū)W以致用。將vue 融入Web 前端開(kāi)發(fā)課程當(dāng)中，讓學(xué)生們了解當(dāng)前最流行的輕量級(jí)響應(yīng)式框架，對(duì)于學(xué)生們學(xué)習(xí)該課程以及未來(lái)參加網(wǎng)站開(kāi)發(fā)相關(guān)工作都有著非常大的幫助作用。