Vue常用组件库的比较分析(pc端)

前言:
Vue.js(读音 /vjuː/, 类似于 view)是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习,非常容易与其它库或已有项目整合。另一方面,在与相关工具和支持库一起使用时,Vue.js 能完美地驱动复杂的单页应用。

本篇文章就是对pc端的各大组件库进行分析比较 ,以便根据实际情况选择自己需要的组件库,包括pc端和移动端。

1、Element(pc):饿了么前端团队开发的桌面端组件库

介绍: 饿了么前端团队开发的桌面端组件库,当前最新版本:v2.8.2
Star: 37.186k
项目特点:

1.团队维护
2.支持三个版本:vue、react、angular
3.支持 Nuxt.js
4.常规支持:多语言、自定义主题、按需引入、内置过渡动画
5.文档详细,组件齐全
6.支持响应式布局,提供基于断点的隐藏类
7.适合常规 pc 端项目

样式: 类名大量使用计算属性,css 和主文件分离单独一个文件
官网地址
GitHub地址

2、iView(pc):主要服务于 PC 界面的中后台产品

最新版本: v3.4.1
Star: 21.063k
项目特点:

1.团队维护
2.支持: Nuxt.js、TypeScript、Electron
3.常规支持:多语言、自定义主题、按需引入
4.文档详细,组件齐全
5.支持响应式布局
6.UI 比较美观
7.适合常规 pc 端项目,皮肤美观

样式: less 计算属性 前缀嵌套
官网地址
GitHub地址

3、vuetify(pc):一个试图推动前端开发发展到一个新水平的组件

介绍: Vuetifyjs 根据材料设计规格提供 UI 布局。 V 1.0 Alpha 版本提供了超过 80个 reusbale 组件,其中包含一个易于记忆的语义设计,它基于名称简单明了 type-as-you 的类型属性。在GitHub 上有超过 18K 的 star。
官网地址

4、vue-strap(pc):基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件

介绍: 基于 Vue.js 的 Bootstrap 组件 该仓库包含一系列基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件。所以不需要 jQuery 和 Bootstrap 的 JavaScript 文件,唯一需要依赖的是: Vue.js Bootstrap CSS ,VueStrap 不依赖某个非常精确的 Bootstrap 版本。如果喜欢bootstrap的小伙伴又不想换jquery的开发方式是不二的选择。
官网地址

5、buefy(pc):即装即用的轻量级UI组件

**介绍:**Buefy 基于 Bulma 和 Vue.js 的轻量级UI组件,它提供了即装即用的轻量级组件。虽然组件选择有限,但是值得你去尝试。
官网地址

6、Vue-Blu(pc):全面、灵活且强大的ui组件

介绍: Vue-Blu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。全面、灵活且强大的ui组件,API友好。
官网地址

7、vue-beauty(pc):漂亮的 vue 组件库

介绍: 基于 ant design 的漂亮的 vue 组件库;vue-beauty 是一套基于 vue.js 和 ant-design样式 的PC端 UI 组件库,旨在帮助开发者提升产品体验和开发效率、降低维护成本。
官网地址

8、at-ui(pc):一个体面的干净整洁的 UI 组件

介绍: AT-UI 是一个模块化的前端 UI 框架,开发基于Vue.js 的快速和强大的 Web 界面。专门为桌面应用程序构建,AT-UI提供了一套 npm + webpack + babel 前端开发工作流程。全英文的文档对用户来说可能是具有有挑战性的,但它提供了一个体面的干净整洁的 UI 组件。
官网地址

9、Keen UI:纯英文文档

最新版本: v3.7.1
Star: 3.700k
项目特点:
纯英文文档。

官网地址
GitHub地址

10、Vue Material:具有精美动效的组件

最新版本: v1.0.0
Star: 7.831k
项目特点:
1.Material 设计:是一个轻量级的框架, 建立在谷歌的 Material Design 基础上。 设计强大的和美观的web应用并适用于不同的屏幕。
2.全功能应用:可以动态地生成和使用主题,根据自己的需求只用组件,UI元素与组件的优势在于可以更简单的使用API和其他的。
3.兼容性:它的目的是提供一组可重用的组件和一系列的UI元素,使用 Vue 2.0 建立支持 主流的浏览器 的应用。

官网地址
GitHub地址

:以上最新版本号和Star数量更新于2019/4/30。
参考地址:

目前有几个常用Vue移动组件,包括Vux、Mint UI、Vant、cube-ui、MUI、Muse-ui和vonic。其中,Vux是一个类似微信样式的移动组件Mint UI是饿了么前团队开发的移动组件Vant是有赞团队开发的移动组件,cube-ui是滴滴团队开发的移动组件,MUI是一个最接近原生APP体验的高性能前框架,Muse-ui是基于Vue 2.0的优雅的Material Design UI组件,vonic则是用于快速构建移动单页应用的组件。这些组件都提供了丰富的组件和功能,可以帮助开发者快速构建高质量的移动应用。你可以根据自己的需求选择适合的组件进行开发。\[1\]\[2\]\[3\] #### 引用[.reference_title] - *1* [Vue常用组件比较分析(移动)](https://blog.csdn.net/weixin_38633659/article/details/89736656)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [Vue常用组件大全【前工程师必备】【实时更新】【移动PC端(web)、数据可视化组件(数据大屏...](https://blog.csdn.net/qq_44757034/article/details/128090797)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

瓜子三百克

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值