田晨

摘 要：采用當下熱門開發(fā)技術 SpringBoot+Vue+Mybatis，分別介紹幾種技術的特點及其運用，對掌握三種技術及其開發(fā)應用具有參考價值。

關鍵詞：Vue框架;SpringBoot框架;Mybatis框架

1 概述

1.1Vue框架：Vue 是一套構建用戶界面的漸進式框架，采用自底向上增量開發(fā)的設計方式，是更加靈活、開放的解決方案，架構更加簡單，適合開發(fā)人員快速掌握其全部特性并投入使用，還便于與第三方庫或有項目整合。結合Vue 生態(tài)系統(tǒng)支持庫 Vuex、Vue-router，能夠為復雜的應用程序提供驅動。Vue 的核心是響應式原理，把一個普通 JavaScript 對象傳給 Vue 實例的 data 選項，同時每個 Vue 實例都有相應的watcher 實例對象。如果data 的屬性發(fā)生變化，會通知watcher重新計算，從而致使它關聯的組件得以更新。Vue 異步執(zhí)行

DOM 更新。只要觀察到數據變化，Vue 將開啟一個隊列，并緩沖在同一事件循環(huán)中發(fā)生的所有數據改變。如果同一個watcher 被多次觸發(fā)，只會一次推入到隊列中，在緩沖去除了重復數據，避免了不必要的計算和DOM 操作。Vue 的響應為雙向綁定數據，實時反映數據的真實變化，并映射到數據源上，避免了前端頁面開發(fā)中DOM 選擇器繁雜的操作。

特點：①靈活開放;②易學易用，有更多成熟工具的支持;③性能好，易優(yōu)化;④有功能強大的路由機制;⑤有多種方式實現過渡效果。

應用過程：利用 Vue 官網提供的 vue-cli 工具，幾分鐘就可創(chuàng)建并

啟動帶熱重載、保存時的靜態(tài)檢查、可用于生產開發(fā)環(huán)境的構建配置項目。由于項目使用了較多的js 組件，可利用Webpack 組件，根據模塊的依賴關系進行靜態(tài)分析，然后將這些模塊按照指定的規(guī)則生成對應的靜態(tài)資源;可以將多種靜態(tài)資源js、css、less 轉換成一個靜態(tài)文件，減少了頁面的請求，同時，方便了 Web 的開發(fā)。該系統(tǒng)前、后端開發(fā)同時進行，我們利用mockjs 生成隨機數據，模擬各種場景，提升了 Web 測試的真實性，實現了前、后端分離，實現了 Web 前后端獨立開發(fā)。

1.2SpringBoot框架：SpringBoot是由Pivotal團隊提供的全新框架，是Java平臺上的一種開源應用框架，提供具有控制反轉特性的容器目的是用簡化新Spring應用的初始搭建和開發(fā)過程。SpringBoot對于Java的快速開發(fā)是有幫助的，它簡化了開發(fā)過程、配置過程、部署過程和監(jiān)控過程。SpringMVC為Spring框架提供的構建Web應用程序的全功能MVC模塊。

優(yōu)點：（1）減少開發(fā)，測試時間和努力（2）使用JavaConfig有助于避免使用XML（3）避免大量的Maven導入和各種版本沖突（4）提供意見發(fā)展方法（5）通過提供默認值快速開發(fā)（6）因沒有web.xml文件故而需要更少的配置。只需要添加用@Configuration注釋的類，然后添加用@Bean注釋的方法，Spirng將自動加載對象并像以前一樣對其進行管理。甚至可以將@Autowired添加到bean方法中，以使Spring自動裝入需要的依賴關系中。

應用過程：

階段一：收集和注冊

第一個階段可以認為是構建和收集bean定義的階段，在這個階段，我們可以通過xml或者Java代碼的方式定義一些bean，然后通過手動組裝或者讓容器基于某些機制自動掃描的方式，將這些bean定義收集到ioc容器中。

階段二：分析和組裝

當第一階段工作完成后，我們可以先暫且認為ioc容器中充斥著一個個獨立的bean，它們之間沒有任何關系。但實際上，它們之間是有依賴關系的，所以，ioc容器在第二個階段要干的事情就是分析這些已經在ioc容器中的bean，然后根據它們之間的依賴關系先后組裝它們。如果ioc容器發(fā)現某個bean依賴另一個bean，它就會將這另一個bean注入給依賴它的那個bean，直到所有bean的依賴都注入完成，所有bean都整裝待發(fā)，整個ioc容器的工作即算完成。

1.3Mybatis框架：M ybatis 是 一 款 基 于 Jav a 的 持 久 層 框 架。相 對 于 JDB C，M yB afis使用起來更加靈活，在使用的時候 更加專 注于 C U R D，避免 了一些重復 f生代碼，使用起來更加方便。M yB atis 應 用程 序 主要 都 是使 用 SqlSessionFactory 的 實 例，一 個 SqlSessionFactory 實 例 可 以 通 過 S qls essionF actoryB uilder 獲 得。用 xm l 文 件 構 建 sqlsessionFactory 實例是非 常簡單 的事情。將 M y B atis 和 Spring 集成 后，SqlSessionF actory 和 session 的獲取、釋放都 可 以交給 Spring 來 處理。

優(yōu)點：不屏蔽SQL，意味著可以更為精確定位SQL語句，可以對其進行優(yōu)化和改造，這有利于互聯網系統(tǒng)性能的提高，符合互聯網需要性能優(yōu)化的特點。

提供強大、靈活的映射機制，方便Java開發(fā)者使用。提供動態(tài)SQL的功能，允許我們根據不同組裝SQL，這個功能遠比其他工具或者Java編碼的可讀性和可維護性高得多，滿足各種應用系統(tǒng)的同時也滿足了需求經常變化的互聯網應用的要求。

在Mybatis中，提供了使用Mapper的接口編程，只需一個接口和一個XML就能創(chuàng)建映射器，一進步簡化我們的工作，使得很多框架API和Mybatis中消失，開發(fā)者更能集中于業(yè)務邏輯。

應用過程：1 創(chuàng)建 Java 項目。2 加入 jar 包（核心包，驅動包，依賴包）。 3 創(chuàng)建主配置文件 sqlMapConfig.xml，日志格式配置文件 log4j.properties。4 創(chuàng)建 pojo，注意這里的 pojo 要和數據庫字段相對應。5 書寫實體類對應的 mapper 文件，該文件主要用來寫 SQL。6 加載 mapper 文件，在 sqlMapConfig.xml 中使用 Mappers 標簽進行關聯。

2 前端開發(fā)

采用 IntelliJ IDEA 編輯器袁 使用 node.js 技術安裝vue-cli 腳手架構建工具袁 綜合集成 iview、store，快速搭建前端頁面，腳手架執(zhí)行過程院：index.html->main.js->app.vue。主程序入口文件main.js，主要完成 Vue對象的創(chuàng)建工作，完成路由對象、vuex 對象的加載。

3 后端開發(fā)

后端服務器開發(fā)采用 Springboot 框架，完成與前端頁面及后臺數據庫的交互。采取三層架構模型 Con—troller堯、Service、Dao 層，通過過濾器實現跨域訪問及全局守衛(wèi)。

4 結語

本文介紹了Spring、Mybatis、Vue的介紹及其優(yōu)點項目采用前后端分離的理念，vue 負責頁面展示，SpringBoot 負責業(yè)務邏輯處理，利于項目開發(fā)及后期維護。

參考文獻

[1]梁灝.Vue.js 實戰(zhàn).清華大學出版社，2017.

[2]張宇，王映輝，張翔南.基于 Spring 的 MVC 框架設計與實現[J].計算機工程，2010，36（4）：59-62.

[3]劉增輝.Mybatis 從入門到精通.電子工業(yè)出版社，2017.