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

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

青灯夜游
發布: 2022-05-05 21:12:36
轉載
6297 人瀏覽過

這篇文章跟大家分享5 款適合國內使用的 Vue 行動裝置 UI 元件庫,希望對大家有幫助!

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

在Vue 3 正式版發佈一段時間後,各大元件庫、框架紛紛對Vue 3 做了支援與最佳化,特別是Vue 行動端元件庫,有了跨越式的升級。幾家頭部大廠也全面擁抱 Vue 3 ,陸續發布了支援 Vue 3 的行動裝置 UI 元件庫,非常值得安麗一波。 (學習影片分享:vuejs教學

本文篩選了國內常用的Vue 行動裝置UI 元件庫,選出了5 款來自國內網路一線大廠或商業化較好的企業/ 個人長期維護的免費行動端UI 庫分享給大家。

  • Vant 3 - 有讚移動UI 元件庫,支援Vue 3 微信小程序,支付寶小程式
  • Cube UI - 滴滴出行行動端UI 庫,品質可靠,標準規範,擴展性強
  • VUX - 行動端UI 元件庫,針對微信強勢優化
  • NUTUI 3.0 - 京東行動端UI 庫,面向電商業務場景,支援Vue3
  • Vuetify 3 - 老牌Vue UI ,基於Google的Material Design 樣式開發,支援Vue3

1、Vant 3 - 有讚移動UI 元件庫,支援Vue 3 微信小程序,支付寶小程序

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

#Github:https://github.com/youzan/vant

首先推薦有讚團隊開源的Vant 3 行動裝置UI 元件庫,不僅已全面支援Vue 3 而且還支援微信小程式和支付寶小程式。可以說行動端 UI 元件庫王者。 Vant 對內承載了有讚所有核心業務,對外服務十多萬開發者,是業界主流的行動端元件庫之一。

Vant 3 的效能極佳,組件平均尺寸小於 1KB (min gzip),內建 65 個高品質元件,涵蓋了主流使用情境中的多數需求。有 700 個主題變量,引入了 Tree-Shaking 可按需引入元件,減少打包體積。

2、Cube UI - 滴滴出行行動裝置UI 函式庫,品質可靠,標準規範,擴充性強

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

Github:https://github.com/didi/cube-ui

#滴滴團隊開源的Cube UI 行動裝置Vue UI 元件庫,輕巧趁手。

Cube UI 品質可靠,由滴滴內部元件庫精簡提煉而來,經歷了業務一年多的考驗,並且每個元件都有充分單元測試,為後續整合提供保障。體驗極致,以快速回應、動畫流暢、接近原生為目標,在互動體驗方面追求極致。

Cube UI標準規範,遵循統一的設計互動標準,高度還原設計效果;介面標準化,統一規範使用方式,開發更加簡單有效率。擴展性強,支援按需引入和後編譯,輕量靈活;擴展性強,可以方便地基於現有組件實現二次開發。

3、VUX - 行動裝置UI 元件庫,針對微信強勢最佳化

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

## Github:https://github.com/airyland/vux

VUX 是一款低調的行動裝置Vue UI 元件庫,純靠作者個人興趣支持,已經維護了5、6年了。主要服務於行動端,對微信友善支援。支援 vux-loader 保證了元件按需使用,不用擔心打包體積過大。 VUX 並非完全依賴 

WeUI (微信的設計 UI 函式庫),VUX 在 WeUI 的基礎上擴展了多個常用元件,但是盡量保持整體UI樣式接近 WeUI 的設計規格。

4、NutUI 3.0 - 京東行動端UI 庫,面向電商業務場景

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

Github:https://github.com/jdf2e/nutui

NutUI 3.0 是京東發布的Vue 3 行動裝置UI 元件庫。對行動端友好,特別針對行動端電商業務場景最佳化測試。 70 高品質 UI 元件,基於京東 APP 10.0 對視覺規範開發,支援按需引用,支援 TypeScript,支援主題自訂。可以使用 Vue 語言來編寫在 H5、小程式平台上的應用,幫助我們提升開發效率,並改善開發體驗。

5、Vuetify 3 - 老牌 Vue UI ,基於Google的 Material Design 樣式開發##

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

Github:https://github.com/vuetifyjs/vuetify

Vuetify 老牌Vue UI 元件庫,它提供了豐富的常用組件(有超過100 個組件),適用於多數場景下的使用情況。 Vuetify 是基於Google的 Material Design 樣式開發,無需寫一行 CSS 就能產生相當整潔清爽的介面功能。 Vuetify 支援 PC 端和行動端,對行動端有特別棒的最佳化,響應式,配置簡單,有響應式網路系統,支援事件處理,支援多種瀏覽器,甚至連 IE 11 也支援。 Vuetify 已經發布支援 Vue 3 的版本,如果正在考慮未來的遷移問題,可放心使用。

擴充功能:Vue UI 元件庫與卡拉雲

#本文介紹了5 款Vue 行動裝置UI 元件庫,雖然這些元件庫可以避免我們重複造輪子,但即便如此,前端調試有時也非常令人抓狂。如果不想處理前端問題,推薦使用卡拉雲,卡拉雲內建各類組件,無需懂任何前端,只需拖曳即可快速生成。

5 款適合國內使用的 Vue 行動裝置 UI 元件庫

這是一個用卡拉雲搭建的資料庫 CURD 後台管理系統,只需拖曳元件,即可在10分鐘內完成建置。

看更多模版:https://kalacloud.com/templates/

#原文網址:https://kalacloud.com/blog/best -vue-mobile-ui-component-libraries/

(學習影片分享:web前端開發程式設計入門

以上是5 款適合國內使用的 Vue 行動裝置 UI 元件庫的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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