方 生,秦曉安,王 睿
(安徽商貿(mào)職業(yè)技術(shù)學(xué)院,安徽 蕪湖 241002)
隨著Web技術(shù)的快速發(fā)展,Web應(yīng)用正朝著兼容多終端、高性能的方向飛速發(fā)展[1]。傳統(tǒng)的Web開發(fā)逐漸不能適應(yīng)大規(guī)模互聯(lián)網(wǎng)應(yīng)用對異構(gòu)技術(shù)棧多樣性和多團(tuán)隊協(xié)同開發(fā)模式的要求[2]。因此,許多研究試圖改進(jìn)MVC體系結(jié)構(gòu)。然而,由于MVC架構(gòu)的局限性,很難將前端和后端服務(wù)完全分離。各種本應(yīng)明確劃分的服務(wù)混雜在一起,給開發(fā)帶來諸多不便[3]。筆者針對軟件系統(tǒng)開發(fā)過程中存在的前后端嚴(yán)重耦合的問題,基于當(dāng)前的前后端技術(shù)體系,提出了一種前后端分離的軟件架構(gòu)模式。
1.1.1Vue.js
為了提高開發(fā)效率,基于Vue.js(以下簡寫為Vue)框架開發(fā)了Web前端。Vue是一種用于搭建軟件界面的漸進(jìn)式前端框架。它采用自下而上的增量開發(fā)設(shè)計方法,是一種更靈活、更開放的解決方案,具有更簡單的體系結(jié)構(gòu),便于開發(fā)人員快速掌握,還便于與第三方庫或現(xiàn)有項目集成,可以為復(fù)雜的應(yīng)用程序提供驅(qū)動程序[4]。
Vue采用MVVM(model-view-model)開發(fā)模式。此模式將前端從原始DOM操作中解放出來,使人們不再需要花費大量的時間來維護(hù)視圖和數(shù)據(jù)的統(tǒng)一,而只需要關(guān)注數(shù)據(jù)的變化。Vue的核心是一個快速響應(yīng)的數(shù)據(jù)綁定系統(tǒng)。綁定建立后,DOM將與Vue對象中的數(shù)據(jù)同步。這樣,就不需要手動獲取DOM值。將其同步到JS中,可使代碼變得更加簡潔易懂。MVVM開發(fā)模式架構(gòu)如圖1所示。

圖1 MVVM開發(fā)模式架構(gòu)圖Fig.1MVVM development pattern architecture
1.1.2BootstrapVue
BootstrapVue是 基 于Bootstrap v4+Vue.js的 前端UI框架。它基于全球最流行的Bootstrap V4框架,在Vue.js前端棧基礎(chǔ)上,構(gòu)建了移動優(yōu)先的響應(yīng)式門戶。……