首頁 > web前端 > Vue.js > 主體

2022年值得收藏的17個Vue 後台管理模板

青灯夜游
發布: 2021-12-29 14:12:32
轉載
17956 人瀏覽過

本篇文章給分享17個值得收藏的vue後台管理範本。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

2022年值得收藏的17個Vue 後台管理模板

相關推薦:《vue.js教學

後面的範本是我們做後台管理系統常需要的東西。雖然,我們總可以花很多時間從頭開始設計自己的模板,但有現在的模板讓我們套,節省我們更多時間用來摸魚,何樂而不為呢。

這些現有出色模板,除了節省時間外,還附帶這些好處:

  • 內建常用案例的元件
  • 跨不同視圖的一致樣式
  • 內建響應式設計
  • 技術支援與文件

1. Vue Black Dashboard Pro

##線上網址:https ://demos.creative-tim.com/vue-black-dashboard-pro/?ref=learnvue.co#/dashboard

更多:https://www.creative-tim.com/product/vue- black-dashboard-pro?ref=learnvue.co

2022年值得收藏的17個Vue 後台管理模板

#Vue Black Dashboard Pro是一個Bootstrap 4 Admin Dashboard,其中包含數十個元件,自訂元素,插件和範例程式碼,它們可以完美地滿足我們的設計需求。

我覺得,該預設的配色方案確實具有美感,可為我們的應用程式提供一定程度的專業水準和修飾感。

同時它也有暗模式和亮模式。此可切換功能確實增加了額外的自訂層,可以使應用程式脫穎而出。

2022年值得收藏的17個Vue 後台管理模板

Vue Black Dashboard Pro建立在vue-clivue-router之上,且文件也寫的很詳細。

Vue Black Dashboard Pro 主要特點:

  • 基於Bootstrap 4

  • 有大量範例的詳細文件

  • #200多個自訂元素

  • Sketch,Vue,SASS 和HTML 原始檔

  • 響應式設計

  • 暗模式與亮模式

#2. Vue Paper Dashboard

2022年值得收藏的17個Vue 後台管理模板

線上事例:https://demos.creative-tim.com/vue-paper-dashboard-pro/?_ga=2.230603804.163601398.1609605836-1654756133.16085826912691 www.creative-tim.com/product/vue-paper-dashboard-2-pro?ref=learnvue.co

只需查看Vue Paper Dashboard 2 Pro 的範例頁面,就可以看到從插件一直到不同組件和元素的細節注意。

我對這個範本比較感興趣的事是程式碼庫的組織方式,這種組織方式讓安裝和運作變得非常直觀。

主要特點:

良好的文件
  • #基於Bootstrap 4
  • 響應式設計
  • 160 多個自訂元素
  • #為設計師準備的Photoshop檔案
  • 3. Vue Light Bootstrap Dashboard Pro

#事例位址:https://demos.creative-tim.com/vue-light- bootstrap-dashboard-pro/?&_ga=2.208068498.163601398.1609605836-1654756133.1608582691#/admin/overview2022年值得收藏的17個Vue 後台管理模板

cc-cc-#片#creue-cw-#c-c-c-c-片#-c4-#-#4-c-c-#-片#-c-c-#-c-c-c-c-c-c-c-c-cr-c-c-Mr8-pro-片# pro?ref=learnvue.co

顧名思義,

Vue Light Bootstrap Dashboard Pro

是使用Bootstrap 4和VueJS建構的。

我真正喜歡的 Vue Light Bootstrap 的 一個原因是,我們可以在各種顏色,背景圖像和其他樣式之間自訂側邊欄。

此功能可讓開發人員根據自己的特定專案需求來客製化。無需數小時的額外編程即可提供自訂的感覺。

主要特點:

基於Bootstrap 4
  • 160 多個自訂元素
  • 響應式設計
  • 高度可自訂的側邊欄選單
  • 4. Sing App Vue

線上網址:https://flatlogic.com/templates/sing-app-vue/demo2022年值得收藏的17個Vue 後台管理模板##文件網址:https://flatlogic .com/templates/sing-app-vue

Sing App Vue 是使用Vue2和Bootstrap 4 建構的優秀管理範本。我個人非常喜歡此模板的樣式,並喜歡其遵循的現代設計原則。

主要特點:

響應式設計

  • 8 個圖表庫和2個Dashboard

  • E-Commerce Section

  • Fully Documented Codebase

5. Vue Paper Dashboard

2022年值得收藏的17個Vue 後台管理模板

#範例網址:https://demos.creative-tim.com/ vue-paper-dashboard/?_ga=2.133615758.163601398.1609605836-1654756133.1608582691#/dashboard

文件位址:https://www.d-t. co

這個模板是用Vue2 和Bootstrap 3 建構的,非常適合用於原型和證明概念。 Vue Paper 僅有16種元素,其它 150多種以上的元素則來自付費的Creative Tim,不用免費的 16 種元素,也有很多值得我們學習的地方。

主要特點:

  • 免費下載

  • #16個以上的自訂元素

  • Bootstrap3 管理範本

  • #響應式設計

6. CoPilot

2022年值得收藏的17個Vue 後台管理模板

線上地址:https://copilot.mistergf.io/
文件地址:https://github.com/misterGF/CoPilot

CoPilot 是另一個免費的基於Bootstrap 的響應式管理範本。作為一個開源項目,CoPilot 入門就像克隆 Github 儲存庫一樣容易!

我喜歡 CoPilot 頁面頂部的漂亮的載入器動畫。加載不同組件時的進度條確實使該應用程式具有現代感和優美感。

主要特點:

  • 開源

  • #響應式設計

  • 乾淨直覺的使用者介面

  • 快速安裝

#7. Vuetify Material Dashboard

2022年值得收藏的17個Vue 後台管理模板

#線上網址:https://demos.creative-tim.com/vuetify-material-dashboard-pro/?_ga=2.4509107.163601398.1609605836-1654756133.16085826911:https# //www.creative-tim.com/product/vuetify-material-dashboard-pro?ref=learnvue.co

對於具有Vuetify 框架經驗的Vue開發人員來說,Vuetify Material Dashboard 則是絕佳的選擇。

模板不僅看起來很棒,而且還利用了 Material Design 規格創建了一個乾淨,可存取的使用者介面。顏色很棒,模板易於定制,總體而言,一切都做得很好。

這個範本比較上面的,它附帶了 Vuex 來處理狀態管理,這個內建的範本有一定的優點。

主要特點:

內建Vuetify
  • 內建了對Vuex 的支援
  • 高度可自訂的範本
  • 200多個自訂元素
  • 響應式設計
8. Vue White Dashboard

2022年值得收藏的17個Vue 後台管理模板範例網址:https://demos.creative-tim.com/vue-white-dashboard/

文件:https://www.creative-tim.com/product/vue-white-dashboard?ref=learnvue.co


Vue White Dashboard

是一個免費的Bootstrap 4 管理範本。有16個免費元素,3個自訂插件和7個範例頁面,對於那些只想尋找一種免費方法來測試其儀表板的人來說,這是一個很好的起點。 主要特點:

免費
  • Bootstrap4 管理範本
  • 響應式設計
  • 16個自訂元素
9. Vue Chuck Admin

2022年值得收藏的17個Vue 後台管理模板#範例網址:https://alpixel.github.io/vue-chuckadmin/ #/

文件位址:https://github.com/alpixel/vue-chuckadmin

此開源Vue 管理範本是基於ChuckCSS 框架建置。程式碼中已經新增了許多Vue函式庫,例如

vue-router

Vuex儘管它可能不是“現成的”,但它確實為開發人員在儀表板的佈局,設計和結構上提供了額外的靈活性。

主要特點:

開源
  • 高度可自訂
  • 內建Vue函式庫
  • ##10 . CoreUI Vue

線上網址:https://coreui.io/vue/demo/free/3.1.1/#/dashboard12022年值得收藏的17個Vue 後台管理模板 文檔網址:https://coreui.io/vue/

CoreUI Vue 是CoreUI 的免費Vue 範本。它建立在Bootstrap之上,提供了100多種自訂元素,例如按鈕,卡片,圖像輪播等等,從而使開發過程變得輕鬆自如。

我真的很喜歡CoreUI的風格和文件的清晰程度。

主要特點:

免費的Vue 範本

    良好的文件
  • 行動裝置友好,跨瀏覽器相容性
  • 100多個可重複使用且可自訂的小部件
  • 11. Vue Element Admin

線上網址:https://panjiachen.github.io/vue-element-admin/#/login?redirect=/dashboard

文件網址:https://github.com/PanJiaChen/ vue-element-admin

Vue Element Admin是另一個開源Vue 背景範本。它建立在Element UI庫的基礎之上,Github上的有63K顆星,非常受歡迎。

對於免費工具,Vue Element Admin中包含大量的元件,頁面和功能。

借助已內建的登入權限,文字編輯器,資料匯出等功能,這對於想要功能強大的後台範本這是一個不錯的選擇。

主要特點:

  • 開源
  • 響應式元素
  • 眾多功能
  • 高度可自訂

#12. Vuestic

12022年值得收藏的17個Vue 後台管理模板

#線上網址:https://vuestic.epicmax.co/admin/dashboard
文件位址:https://github.com/epicmaxco/vuestic-admin

Vuestic Admin 是一個免費的Vue.js管理模板,包含44 自訂UI元件。

Vuestic Adminn 具有高度可自訂性,可滿足我們的任何儀表板需求,並且設計是一種時尚,專業的方式來顯示資料。

主要特點:

  • 免費管理範本
  • 高度可自訂的44 元素
  • 多主題
  • 回應式設計

13. Bootstrap Vue Argon Dashboard Pro

12022年值得收藏的17個Vue 後台管理模板

從視覺上來說,Creative Tim 的這個儀表板是我最喜歡的儀表板之一。所有元素看起來都非常乾淨,可以有效地顯示數據,並且所有內容都非常易於自訂。

擁有200多個可以使用SASS樣式進行修改的元件,使用此範本可以輕鬆進行開發。

主要特點:

  • 200 的元素
  • 響應式Bootstrap 儀表板
  • 17個自訂外掛
  • #優秀的文件

14. Vue Material Template

12022年值得收藏的17個Vue 後台管理模板

線上網址:https://flatlogic.com/templates /vue-material-template-full/demo
文件位址:https://flatlogic.com/templates/vue-material-template-full

##Vue Material Admin Template是一個基於Vue的Material Design後台管理模板,使用Vuetifyjs作為基礎的框架。

主要特點:

    流暢的響應式設計
  • 基於Vuetify和Material Design
  • 三種色彩主題和深色模式
  • Vuex和Vue-Router支援

15. Light Blue Vue Lite

12022年值得收藏的17個Vue 後台管理模板

淺藍色主題Vue管理模板(Light Blue Vue Admin)是一個免費的Vue.js和Bootstrap 4儀表板模板,設計獨特、具有稍微透明的小部件和漸變背景。

淺藍色主題Vue管理範本(Light Blue Vue Admin)可以輕鬆為IoT儀表板、SAAS啟動、預訂管理系統或任何其他Web應用程式建立管理介面。

12022年值得收藏的17個Vue 後台管理模板

16. Vue Material Dashboard

12022年值得收藏的17個Vue 後台管理模板

Vue Material Dashboard是使用Vue Material的另一個免費資源。這是建立快速應用程式的絕佳模板,它甚至可以用於大型應用程式。

程式碼本身有很好的文件說明,易於自訂,甚至Vue Router已經為您設定好了。

主要特點:

    免費範本
  • 使用Vue Material
  • 良好的文件記錄
線上網址:https://demos.creative-tim.com/vue-material-dashboard/

#文件位址:https://www.creative-tim.com/product/vue-material-dashboard?ref =learnvue.co

17. Vue Now UI Dashboard Pro

12022年值得收藏的17個Vue 後台管理模板

#線上位址:https://demos.creative- tim.com/vue-now-ui-dashboard-pro/?_ga=2.201309230.163601398.1609605836-1654756133.1608582691#/dashboard##procative-#-www. -ui-dashboard-pro?ref=learnvue.co

翻譯網址:https://segmentfault.com/a/1190000039833325

#更多程式相關知識,請造訪:

程式設計影片
! !

以上是2022年值得收藏的17個Vue 後台管理模板的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
vue
來源:segmentfault.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板