vue 移動端PC端選用的ui框架


開源項目下載地址vue-element-admin    https://github.com/PanJiaChen/vue-element-admin

1.pc端的項目,最好的選擇是ElementUI。(pc端)

  一套為開發者、設計師和產品經理准備的基於 Vue 2.0 的桌面端組件庫。Element是餓了么前端開源維護的Vue UI組件庫,更新頻率還是很高的,基本一周到半個月都會發布一個新版本。組件齊全,基本涵蓋后台所需的所有組件,文檔講解詳細,例子也很豐富。沒有實際使用過,網上的Element教程和文章比較多。Element應該是一個質量比較高的Vue UI組件庫。目前 star值36K;

  官網地址:http://element-cn.eleme.io/#/zh-CN

  github地址:https://github.com/ElemeFE/element 

2.iview組件庫(pc端)

  iView 是一套基於 Vue.js 的開源 UI 組件庫,主要服務於 PC 界面的中后台產品。iView的組件還是比較齊全的,更新也很快,文檔寫得很詳細。有公司團隊維護,比較可靠的Vue UI組件框架。iView生態也做得很好,還有開源了一個iView Admin,做后台非常方便。官網上介紹,iView已經應用在TalkingData、阿里巴巴、百度、騰訊、今日頭條、京東、滴滴出行、美團、新浪、聯想等大型公司的產品中。

  iView官網:https://www.iviewui.com/

  github地址:https://github.com/iview/iview

3.vux 基於Vue和WeUI的移動UI組件

  Vux是基於WeUI和Vue2.x開發的移動端UI組件庫,主要服務於微信頁面。Vux的定位已經很明確了,

  一是:Vue移動端UI組件庫,

  二是:WeUI的基礎樣式庫。

  Vux的組件涵蓋了所有的WeUI的內容,還擴展了一些常用的組件。比如:Sticky、timeline、v-chart、XCircle。Vux是個人維護的。在GitHub上看到對issue的關閉還是很迅速的。Vux文檔基本的組件用法和效果都講解到位了。在vux官網上也展示了很多Vux的使用案例。在微信頁面開發中,基本沒有太多的bug,開發還是比較順手的。

  Vux官網:https://vux.li/

  github地址:https://github.com/airyland/vux

4.Mint-UI 餓了么移動端組件庫(移動端)

  Mint UI基於 Vue.js 的移動端組件庫,同樣出自餓了么前端的項目。Mint UI是真正意義上的按需加載組件。可以只加載聲明過的組件及其樣式文件。Mint UI 采用 CSS3 處理各種動效,避免瀏覽器進行不必要的重繪和重排,從而使用戶獲得流暢順滑的體驗。網上的視頻教程很多都是基於Mint UI來講的,開發移動端web項目還是很方便,文檔也很簡介明了。很多頁面Mint UI組件都已經封裝好,基本可以照着例子寫,簡單的調整一下就可以實現。

  官網地址:http://mint-ui.github.io/#!/zh-cn

  github地址:https://github.com/ElemeFE/mint-ui

5.vue-admin 管理面板UI框架

  github地址:https://github.com/vue-bulma/vue-admin

6.vue-material為 Vue.js 打造的 Material 風格的組件

  github地址:https://github.com/vuematerial/vue-material

7.vue-strap基於 Vue.js 的 Bootstrap 組件

  github地址:https://github.com/yuche/vue-strap

8.KeenUI 基於Material Design的UI

  github地址:https://josephuspaye.github.io/Keen-UI/

9.AT-UI UI組件庫AT-UI 是一款基於 Vue.js 2.0 的前端 UI 組件庫,(pc端)

  主要用於快速開發 PC 網站中后台產品,支持現代瀏覽器和 IE9 及以上。AT-UI 更加精簡,實現了后台常用的組件。

  AT_UI官網:https://at-ui.github.io/at-ui/#/zh

10.Vant是一個輕量、可靠的移動端 Vue 組件庫。(移動端-商城)

  Vant是有贊團隊開源的,主要維護也是有贊團隊。Vant Weapp 是有贊移動端組件庫 Vant 的小程序版本,兩者基於相同的視覺規范,提供一致的 API 接口,助力開發者快速搭建小程序應用。截止到目前,Vant已經開源了50+ 個經過有贊線上業務檢驗的組件。比如:、AddressEdit 地址編輯、AddressList 地址列表、Area 省市區選擇、Card 卡片、Contact 聯系人、Coupon 優惠券、GoodsAction 商品頁行動點、SubmitBar 提交訂單欄、Sku 商品規格彈層。如果做商城的,不太在意界面,實現業務邏輯的話,用Vant組件庫開發還是很快的。

  vant官網:http://mint-ui.github.io/#!/zh-cn

11.we-vue UI組件庫we-vue 是一套基於 Vue.js 的移動關組件庫 (移動端)

  we-vue UI組件庫we-vue 是一套基於 Vue.js 的移動關組件庫,結合 weui.css 樣式庫,封裝了一系列組件,非常適於微信公眾號等移動端開發。we-vue 包含35+ 個組件,單元測試覆蓋率超 98%,支持 babel-plugin-import,完善的在線文檔,詳細的在線示例。

  we-vue官網:https://wevue.org/

 

12.Mand MobileMand Mobile是面向金融場景的Vue移動端UI組件庫(移動端-金融)

  豐富、靈活、實用,快速搭建優質的金融類產品,讓復雜的金融場景變簡單。Mand Mobile含有豐富的組件30+的基礎組件,覆蓋金融場景,極高的易用性組件均有詳細說明文檔、案例演示,汲取最前沿技術,組件化輕量化實現,兼顧穩定和品質,努力實現金融場景的全覆蓋。

  Mand Mobile官網:https://didi.github.io/mand-mobile/#/zh-CN/home

13.Cube UI 滴滴 WebApp 團隊 實現的 基於 Vue.js 實現的精致移動端組件庫(移動端)

  cube-ui 是基於 Vue.js 實現的精致移動端組件庫。由滴滴內部組件庫精簡提煉而來,經歷了業務一年多的考驗,並且每個組件都有充分單元測試,為后續集成提供保障。在交互體驗方面追求極致。遵循統一的設計交互標准,高度還原設計效果;接口標准化,統一規范使用方式,開發更加簡單高效。支持按需引入和后編譯,輕量靈活;擴展性強,可以方便地基於現有組件實現二次開發。

    API地址:https://didi.github.io/cube-ui/#/zh-CN/docs/quick-start

  github地址:https://github.com/didi/cube-ui

14.N3-components UI (pc端)

  N3組件庫是基於Vue.js構建的,讓前端工程師和全棧工程師能快速構建頁面和應用。很有力;

  API文檔:https://n3-components.github.io/N3-components/component.html

15.Semantic-UI-Vue UI組件庫Semantic-UI-Vue是基於 Vue.js對Semantic-UI 框架的實現。Semantic作為一款開發框架,幫助開發者使用對人類友好的HTML語言構建優雅的響應式布局。Semantic-UI-Vue提供了一個類似於 Semantic-UI 的 API 以及一組可定制的主題。

  API文檔:https://semantic-ui-vue.github.io/#/

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM