最近在逛各大网站,论坛,SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容也很多,小编自己也趁着这个大前端的热潮,着手学习了一段时间的Vue.js,目前用它正在做自己的公司项目。

学习的过程之中发现继最热的 React 组件库和 Angular 组件库之后,这里有很多个流行和实用的 Vue.js 组件库完善你的下一个用 Vue.JS 编写 UI 界面的应用程序。Vue.js是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。

一:Element

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

介绍:element ui框架的按钮组件,这款由饿了么前端开源的UI框架,一经面世,就收获大量程序员的芳心。在github 上更是高达29.8k的star早已说明一切。用于开发PC端的页面还是绰绰有余的。如果说你是用vue开发者,却没用过element UI,那你肯定不是合格的vue开发者。

二:iview

官网地址:https://www.iviewui.com/

介绍:iView 是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品。使用单文件的 Vue 组件化开发模式 基于 npm + webpack + babel 开发,支持 ES2015 高质量、功能丰富 友好的 API ,自由灵活地使用空间,由TalkingData开发维护,有很多知名互联网企业都在使用。

三:vuetify

官网地址:https://vuetifyjs.com/zh-Hans/

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

四:vue-strap

官网地址:http://yuche.github.io/vue-strap/

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

五:cube-ui

官网地址:https://didi.github.io/cube-ui/#/zh-CN/example

介绍:cube-ui 是滴滴团队开发的基于 Vue.js 实现的精致移动端组件库。支持按需引入和后编译,轻量灵活;扩展性强,可以方便地基于现有组件实现二次开发。

六:buefy

官网地址:https://buefy.github.io/#/

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

七:vue-beauty

官网地址: https://fe-driver.github.io/vue-beauty/#/components/button

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

八:at-ui

官网地址: https://at-ui.github.io/at-ui/#/zh

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

九:Vue-Blu

官网地址: https://chenz24.github.io/vue-blu/#/

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

2018年九个很受欢迎的vue前端UI框架的更多相关文章

  1. 很受欢迎的vue前端UI框架

    最近在逛各大网站,论坛,SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容也很多,小编自己也趁着这个大前端的热潮,着手学习了一段时间的Vue.js,目前用它正在做自己 ...

  2. 关于引入多个jquery冲突的问题(附一个很好用的validate前端验证框架及使用方法)

    废话不多说,进入正题: 如果一个jsp中想要使用两个不同版本的jquery怎么办呢?客官往下看: <script src="${ctxStatic}/jquery/jquery-1.8 ...

  3. 2017年最受欢迎的UI框架

    前端领域最近几年发展的特别迅速,可以说是百家争鸣.在底层的前端框架领域中,最早是jquery称霸互联网,近两年MVVM类型的框架慢慢成为主流,Vue.React和Angular三大框架并驾齐驱.可以说 ...

  4. GitHub 上一份很受欢迎的前端代码优化指南

    http://segmentfault.com/a/1190000002587334?utm_source=weekly&utm_medium=email&utm_campaign=e ...

  5. GitHub 上一份很受欢迎的前端代码优化指南-强烈推荐收藏

    看到一份很受欢迎的前端代码指南,根据自己的理解进行了翻译,但能力有限,对一些JS代码理解不了,如有错误,望斧正. HTML 语义化标签 HTML5 提供了很多语义化元素,更好地帮助描述内容.希望你能从 ...

  6. 推荐20个很有帮助的 Web 前端开发教程

    在平常的搜索中,我碰到过很多有趣的信息,应用程序和文档,我把它们整理在下面这个列表.这是收藏的遇到的有用内容的一个伟大的方式,可以在你需要的时候方便查阅.相信你会在这个列表中发现对你很有用的资料. 您 ...

  7. Crumpet – 使用很简单的响应式前端开发框架

    Crumpet 是一个简单的响应式的基于 SASS/SCSS 的响应式前端框架,保持你的 HTML 代码简洁.内置尽量使用占位符选择器,以减少你的 HTML 标记的大小,没有凌乱的 HTML 代码.快 ...

  8. 推荐几个可以与PhoneGap很好搭配的UI框架

    - xui.js:可以被视作是jquery在phonegap上的替代品,挺好用的- jq.mobi:同上,不过体积比xui.js要大,一般还是用xui.js- jq.ui:jq.mobi配套的UI框架 ...

  9. 推荐20个很有帮助的web前端开发教程

    1. CSS Vocabulary 一个伟大的指向和点击的小应用程序,让你加快速度掌握 CSS 语法的各个不同部分,学习各个属性的正确的名称. 2. Liquidapsive 一个简单的信息化布局,通 ...

随机推荐

  1. OpenStack开发基础-oslo.config

    The cfg Module cfg Module来自于OpenStack中的重要的基础组件oslo.config,通过cfg Module能够用来通过命令行或者是配置文件来配置一些options,对 ...

  2. Composer 很重要很重要 内核 原理

    话题先攒着,过来再来写 先来一张原理图 composer的原理和其他的包管理工具都是一样的,只是实现的细节有些不同,例如yum,例如brew,例如apt-get还有packets. 使用自己的comp ...

  3. 零基础学python-2.24 一些经常使用函数

    今天我举一些经常使用的函数,让大家了解一下: 函数 作用 dir([obj]) 浏览对象的属性 help([obj]) 显示对象的文档字符串 ini([obj]) 将对象转为整形 len([obj]) ...

  4. 利用“反射”动态加载R文件中的资源

    前几天做一个Android下面数据库相关的应用.用ListVIew展示表中数据的时候我希望能给表中每一条记录,加一个展示的图片.但是用数据库保存图片是比较难搞的.于是就把所需图片都保存到res下的dr ...

  5. FZU2150 Fire Game

    题目: 两个熊孩子在n*m的平地上放火玩,#表示草,两个熊孩子分别选一个#格子点火,火可以向上向下向左向右在有草的格子蔓延,点火的地方时间为0,蔓延至下一格的时间依次加一.求烧完所有的草需要的最少时间 ...

  6. Python笔记(九)

    #encoding=utf-8 # python高级编程 # python面向对象 # 创建类 # 无意中把Visual Studio Code的窗口调小了,查了一下,可以使用Ctrl+=放大窗口,使 ...

  7. js编写时间选择框

    效果图: 代码: 新建js:WdatePicker.js /* * My97 DatePicker 4.72 Release * License: http://www.my97.net/dp/lic ...

  8. 多线程之HttpClient

    在程序用调用 Http 接口.请求 http 资源.编写 http 爬虫等的时候都需要在程序集中进行 Http 请求. 很多人习惯的 WebClient.HttpWebRequest 在 TPL 下很 ...

  9. JS和PHP之间以JSON格式传输

    Json是一种的轻量级文本数据交换格式.它独立于编程语言,可以用于在不用的编程语言之间进行数据的交互. 下面简单例举二个使用JSON进行数据通信的例子. 第一个例子: //Javascript以aja ...

  10. 学习环境搭建2——安装django

    下载django https://www.djangoproject.com/download/ 选择最新的版本Latest release,下载后解压.在含有setup.py的文件夹中执行如下命令: ...