推薦三個 Vue 後臺管理模版，配合 Spring Boot 使用真香！

最近由於由於項目的緣由，一直在尋找一款合適的前端模版，以前的 Vue 前端頁面都是本身寫的，寫多了就煩了，由於功能都差很少，寫來寫去就沒意思了。

因此在新項目中想看看市面上的 Vue 後臺管理模版，找個現成的，改一改基本就 OK 了，團隊也省事一些。

老實說，Vue 的生態仍是至關豐富的，經典的、新生的後臺管理框架都有，我這裏和你們分享咱們此次重點比較的三個。

vue-element-admin

• GitHub 地址：https://github.com/PanJiaChen/vue-element-admin
• 演示地址：https://panjiachen.github.io/vue-element-admin

這個項目名氣仍是挺大的，在我剛開始作 vhr 的時候，就有了解過這個項目，那個時候這個項目纔剛剛開發沒多久，star 都沒幾個，如今已然混成一方霸主了。

vue-element-admin 是一個後臺前端解決方案，它基於 vue 和 element-ui 實現。它使用了最新的前端技術棧，內置了 i18n 國際化解決方案，動態路由，權限驗證，提煉了典型的業務模型，提供了豐富的功能組件，它能夠幫助你快速搭建企業級中後臺產品原型。

能夠說，這個項目的功能仍是比較全的，它裏邊將一些常見的功能模塊如權限管理等都作好了，有的時候，你甚至會以爲這個項目有些臃腫。

咱們來看一張效果圖：

這個開源項目也是咱們這裏最終選定的方案，選定它有幾方面的緣由：

1. 這個項目的開發時間較早，目前相對來講可能 BUG 較少，比較穩定。
2. 該項目目前依然很是活躍，做者還在不斷的完善。
3. 功能齊全，和其餘項目相比，功能上基本沒有劣勢。
4. 相對於其餘 UI 框架，ElementUI 使用更多一些，這對於一個商用項目仍是很是重要的。

固然，使用開源項目確定不可能徹底契合本身的需求的，這種就要在開發中，再去慢慢克服了。

ant-design-vue-pro

• GitHub 地址：https://github.com/vueComponent/ant-design-vue-pro
• 演示地址：https://preview.pro.loacg.com

這個也是咱們當時重點比較的項目之一。

Ant Design Pro 是一個企業級中後臺前端/設計解決方案，秉承 Ant Design 的設計價值觀，致力於在設計規範和基礎組件的基礎上，繼續向上構建，提煉出典型模板/業務組件/配套設計資源，進一步提高企業級中後臺產品設計研發過程當中的『用戶』和『設計者』的體驗。隨着『設計者』的不斷反饋，持續迭代，逐步沉澱和總結出更多設計模式和相應的代碼實現。

咱們來看個效果圖：

這個項目也很優秀，可是最終卻「落榜」了，主要是考慮到如下幾個緣由：

1. 這個項目看起來沒有 vue-element-admin 那麼「臃腫」，固然也意味着它的功能比較少。
2. ant design 自己發展時間挺久了，可是一直都是跟 React 玩，去年纔開始支持 Vue，這也是這個 Ant Design Pro 看起來比較簡單的緣由。
3. 這個項目權限部分的代碼，和 vue-element-admin 具備高度類似性，一模一樣，因此還不如直接上 vue-element-admin。

❝

話說回來，不管用哪一個開源項目，想讓項目契合本身的實際應用場景，都是須要大刀闊斧的修改的，開源項目拿來直接就能用的不多，從這個角度講，其實用哪一個都無所謂，反正本身都還要改很多東西。可是因爲只能選擇一個，咱們仍是選擇了更懂 Vue 的 vue-element-admin。

❞

iview-admin

• GitHub 地址：https://github.com/iview/iview-admin
• 演示地址：https://admin.iviewui.com

iView-admin 是 iView 生態中的成員之一，是一套採用先後端分離開發模式，基於 Vue 的後臺管理系統前端解決方案。iView-admin2.0 脫離 1.x 版本進行重構，換用 Webpack4.0 + Vue-cli3.0 做爲基本開發環境。內置了開發後臺管理系統經常使用的邏輯功能，和開箱即用的業務組件，旨在讓開發者可以以最小的成本開發後臺管理系統，下降開發量。

看慣了 ElementUI ，偶爾看一看 iview 或者 ant design，感受還蠻清新的。

來看一看它的效果圖：

❝

老實說，這些框架同質化太嚴重了，除了 UI 不同，其餘的基本上沒啥區別，因此咱們最終仍是選擇了更加經典的 vue-element-admin。

❞

咱們主要是在這三款中進行比較的，因此這裏主要和你們介紹這三個，小夥伴們要是用過其餘好用的，歡迎留言區提出來哦～

如何學習

最後我再囉嗦一句，這種前端框架要如何學習的問題。

若是你是一個前端新手，刷過 Vue 官網可是還沒作過 SPA 應用（甚至沒據說過 SPA 應用），那麼這三個框架對你來講仍是蠻有挑戰的，上手並不容易，我也不是特別建議使用這個來入門。

緣由很簡單，這三個前端框架都算是比較專業的前端框架，裏邊集成了不少東西，若是你是新手的話，很容易就搞懵了。

轉自：https://mp.weixin.qq.com/s/ge8nWbVsj1-6d24l2SXMAw