几款实用的VUE移动端UI框架
文档地址：https://doc.vux.li/zh-CN/演示地址：https://vux.li/demos/v2/?x-page=v2-doc-home#/
基于webpack+vue-loader+vux可以快速开发移动端页面，配合vux-loader方便你在WeUI的基础上定制需要的样式（下拉刷新上拉加载组件不再维护，其余组件相对丰富）
文档地址：https://wangdahoo.github.io/vonic-documents/#/
演示地址：https://wangdahoo.github.io/vonic/docs/#/home
一个基于 vue.js 和 ionic 样式的 UI 框架，用于快速构建移动端单页应用，很简约
文档地址：https://didi.github.io/cube-ui/#/zh-CN/docs/introduction
演示地址：https://didi.github.io/cube-ui/#/zh-CN/example
滴滴 WebApp 团队 实现的 基于 Vue.js 实现的精致移动端组件库；组件效果优；视觉效果很棒
文档地址：http://mint-ui.github.io/docs/#/
演示地址：http://elemefe.github.io/mint-ui/#/
最接近原生APP体验的高性能前端框架
文档地址：https://youzan.github.io/vant/#/zh-CN/intro
演示地址：https://youzan.github.io/vant/mobile.html#/zh-CN/
有赞前端团队基于有赞统一的规范实现的 Vue 组件库，提供了一整套 UI 基础组件和业务组件
文档：http://nutui.jd.com/#/intro
演示地址：http://nutui.jd.com/demo.html#/index
一套京东风格的轻量级移动端Vue组件库
特性
跨平台，自动转微信小程序组件（稍后上线，敬请期待）
30+ 京东移动端项目正在使用
基于京东APP 7.0 视觉规范
支持按需加载
详尽的文档和示例
支持定制主题
支持多语言（国际化）
支持 TypeScript
支持服务端渲染（Vue SSR）
单元测试加持
配套有基于Webpack的构建工具，可快速创建已内置本组件库的Vue工程
绛旓細1. Vuetify鍩轰簬Material Design璁捐鐨刅uetify锛屾嫢鏈38.6k鏄熷拰7k fork锛屾槸Vue.js寮鍙戜腑鐨勭儹闂ㄦ鏋讹紝鐗瑰埆閫傚悎闇瑕佷笓涓氬瑙傚拰鍝嶅簲璁捐鐨勯」鐩2. Element UIElement UI鎻愪緵骞挎硾缁勪欢锛屾敮鎸乄eb寮鍙戯紝53.9k鏄熷拰14.7k fork鍙嶆槧浜嗗叾鍦╒ue.js椤圭洰涓殑骞挎硾浣跨敤銆3. QuasarQuasar鏄竴涓法骞冲彴妗嗘灦锛岄傜敤浜嶹eb銆佺Щ鍔...
绛旓細鍓嶇UI妗嗘灦涓紝Vue鍑熷叾鐏垫椿鎬у拰绀惧尯娲昏穬搴﹀鍙楃灘鐩備互涓嬫槸鍏朵腑涓浜涙渶鍙楁杩庣殑閫夋嫨锛ElementUI: 鐢遍タ浜嗕箞鍥㈤槦鎺ㄥ嚭鐨凟lement UI锛岄傚悎Vue寮鍙戣咃紝GitHub涓婄殑48.1k鏄熸樉绀轰簡鍏跺箍娉涜鍙傚畼缃戝湴鍧锛歟lement.eleme.cn/#... Ant Design Vue: 鍩轰簬Ant Design璁捐瑙勮寖锛岄傚悎浼佷笟绾т腑鍚庡彴浜у搧鐨勫紑鍙戯紝瀹樼綉鍦...
绛旓細2. Vant Vant鏄敱鏈夎禐鍥㈤槦寮鍙戠殑绉诲姩绔粍浠跺簱锛岄拡瀵笻5椤甸潰璁捐锛岃櫧鐒舵暣浣撻鏍煎彲鑳戒笉鏄渶鐙壒锛屼絾鍏剁粍浠跺疄鐢ㄤ笖绋冲畾銆傛嫢鏈80澶氫釜楂樿川閲忕粍浠讹紝瑕嗙洊涓绘祦鍦烘櫙锛岄浂澶栭儴渚濊禆锛屽苟鏀寔TypeScript鍜孲SR銆傛澶栵紝Vant杩樻彁渚涗簡Vue2銆乂ue3銆佸井淇″皬绋嬪簭鍜孯eact鐗堟湰锛岀淮鎶よ壇濂姐3. Element Plus Element Plus鏄タ浜嗕箞鍥㈤槦...
绛旓細棣栨帹Vuetify锛岃繖鏄竴涓笓涓篤ue閲忚韩瀹氬埗銆佷互Material Design涓哄鍚戠殑缁勪欢妗嗘灦銆俈uetify浠ュ叾绮惧績璁捐鐨刄I缁勪欢銆佸竷灞鍜屼富棰樹互鍙婁笌璋锋瓕Material Design鍘熷垯鐨勫畬缇庡鎺ワ紝鍗充娇璁捐鍒濆鑰呬篃鑳藉揩閫熸瀯寤哄嚭涓撲笟姘村钩銆佸搷搴旇繀閫熺殑Web搴旂敤銆俀uasar绱ц窡鍏跺悗锛屼綔涓轰竴涓鐢ㄩ旂殑Vue妗嗘灦锛屼笓涓鸿法骞冲彴搴旂敤锛圵eb銆佺Щ鍔ㄣ佹闈㈠拰Elect...
绛旓細Quasar Framework浠ュ叾楂樻ц兘鍜岃法骞冲彴鑳藉姏锛屾敮鎸佹瀯寤哄鏍峰寲鐨勫簲鐢ㄣ侭uefy浠ulma妗嗘灦涓哄熀纭锛屾彁渚涗簡杞婚噺绾鐨刄I缁勪欢銆侰hakra UI Vue鍏虫敞鍙闂э紝涓烘棤闅滅璁捐甯︽潵鏂板彲鑳姐俈iewUI Plus浣滀负ViewUI鐨勫崌绾э紝鏀寔Vue 3锛屼负鍗囩骇椤圭洰澧炴坊渚垮埄銆傛渶鍚庯紝Vant涓撲负绉诲姩绔璁捐锛屾槸杞婚噺绾х粍浠剁殑鐞嗘兂閫夋嫨銆傝繖浜沀I搴撳悇鏈夌壒鑹诧紝...
绛旓細1. 閫傚悎绉诲姩绔殑UI妗嗘灦锛- Mint UI锛氶タ浜嗕箞鍥㈤槦寮鍙戠殑鍩轰簬Vue鐨勭Щ鍔ㄧUI妗嗘灦銆- SUI Mobile锛氶樋閲屽反宸村叡浜笟鍔′簨涓氶儴UED鍥㈤槦寮鍙戠殑绉诲姩绔疷I搴撱- Weui锛氬井淇″畼鏂硅璁″洟闃熷紑鍙戠殑寰俊Web鏈嶅姟UI搴撱- YDUI Touch锛氫竴鍙敞閲嶅缇庯紝涓旀ц兘楂樻晥鐨勭Щ鍔ㄧ&寰俊UI銆- GMU锛氱櫨搴MU灏忕粍寮鍙戠殑鍩轰簬zepto鐨勮交閲忕骇...
绛旓細鍥涖乧ube-ui 婊存淮鍥㈤槦寮婧愩傛墿灞曟у己锛屽彲浠ユ柟渚垮湴鍩轰簬鐜版湁缁勪欢瀹炵幇浜屾寮鍙戙備綋楠屾瀬鑷达紝浠ヨ繀閫熷搷搴斻佸姩鐢绘祦鐣呫佹帴杩戝師鐢熶负鐩爣锛屽湪浜や簰浣撻獙鏂归潰杩芥眰鏋佽嚧銆傚熀浜vue鐨勭Щ鍔ㄧ缁勪欢搴撹繕鏈夊緢澶氬叾浠栫殑锛岄夋嫨鍚堥傝嚜宸盿pp椤圭洰鐨勫氨鏄渶濂界殑锛屼笂闈㈣繖鍑犱釜妗嗘灦鍩烘湰鍙互搴斾粯缁濆ぇ閮ㄥ垎鐨勫満鏅簡銆
绛旓細Element UI锛氫互鍏剁洿瑙傛槗鐢ㄧ殑鐣岄潰鍜岄珮搴︽ā鍧楀寲鐨勭粨鏋勶紝娣卞彈寮鍙戣呭枩鐖便傛棤璁烘槸鍩虹缁勪欢杩樻槸楂樼骇鍔熻兘锛孍lement UI閮借兘鏃犵紳铻嶅叆浣犵殑椤圭洰锛屾彁鍗囧紑鍙戞晥鐜囥傝屽浜庣Щ鍔ㄨ澶囧紑鍙戯紝Vue鍚屾牱鎷ユ湁涓娴佺殑瑙ｅ喅鏂规锛氱Щ鍔ㄤ紭鍏鐨刄I缁勪欢搴撴帹鑽愶細Vant锛氫笓涓绉诲姩绔璁捐鐨勮交閲忕骇搴擄紝鍏剁粍浠剁畝娲佽屽姛鑳藉己澶э紝鏃犺鏄湪鎬ц兘杩樻槸瑙嗚...
绛旓細 涓涓熀浜 vue.js 鍜 ionic 鏍峰紡鐨 UI 妗嗘灦锛岀敤浜庡揩閫熸瀯寤绉诲姩绔鍗曢〉搴旂敤锛屽緢绠绾 鏂囨。鍦板潃锛歨ttps://didi.github.io/cube-ui/#/zh-CN/docs/introduction 婕旂ず鍦板潃锛歨ttps://didi.github.io/cube-ui/#/zh-CN/example 婊存淮 WebApp 鍥㈤槦 瀹炵幇鐨 鍩轰簬 Vue.js ...
绛旓細Vue.js 甯哥敤鐨 UI 缁勪欢搴撴湁寰堝锛屼互涓嬫槸涓浜涘父鐢ㄧ殑锛1. **Element UI**锛氭槸涓濂椾负寮鍙戣呫佽璁″笀鍜屼骇鍝佺粡鐞嗗噯澶囩殑鍩轰簬 Vue 2.0 鐨勬闈㈢缁勪欢搴撱傚畠鍖呭惈浜嗕竴浜涘父鐢ㄧ殑缁勪欢锛屽琛ㄥ崟銆佹寜閽佽〃鏍肩瓑锛屽彲浠ュ府鍔╀綘蹇熸惌寤轰竴涓紓浜殑鐣岄潰銆2. **Vuetify**锛氭槸涓涓熀浜 Material Design 鐨 Vue.js ...
