推荐几款Vue后台管理系统的框架,以便备用

Vue.js 是一个目前比较流行的前端框架,在业界也算很有名气,今天这里为大家罗列一下基于Vue的后端管理的框架。

使用这些框架你会发现它包括了我们常用的路由,状态,交互等等,我们只需要去复用它的代码,加上一下我们自己少量的逻辑就能轻松的完成项目。

会为你节约更多时间喝喝咖啡等,给你一种“框架在手,天下我有”的感觉。这篇文章主要介绍element和Vue Admin。

1、element

Element UI 是一套采用 Vue 2.0 作为基础框架实现的组件库,它面向企业级的后台应用,能够帮助你快速地搭建网站,极大地减少研发的人力与时间成本。在这个月的 NingJS 上我们开源了这个项目,当时它的文档还没有准备好。

今天,经过两周多的完善, Element UI 的文档正式上线啦!目前它处于 rc 阶段,正式版将于 Vue 2.0 发布后第一时间跟进。

欢迎大家来使用和完善,一起把它做成 Vue 最好的企业级组件库。

  • 评价:网站快速成型工具 Element,非常出色的后台管理系统框架,直接填内容即可。

官网:http://element.eleme.io
地址:https://github.com/PanJiaChen/vue-element-admin


2、Vue Admin

Vue Admin 是一个基于 Vue 2.0 & Bulma 0.3 的后台管理面板(管理系统),相当于是 Vue 版本的 Bootstrap 管理系统,提供了一组通用的后台界面 UI 和组件,其中还有丰富的图表组件,开箱即用

官网:https://admin.vuebulma.com
地址:https://github.com/taylorchen709/vue-admin


3、vue-manage-system

基于Vue.js 2.x系列 + Element UI 的后台管理系统解决方案 ,弥补了element中缺少图片裁剪上传、富文本编辑器、图表等这些在后台管理系统中很常见的功能。适用于绝大部分的后台管理系统(Web Management System)开发。

基于vue.js,使用vue-cli脚手架快速生成项目目录,引用Element UI组件库,方便开发快速简洁好看的组件。分离颜色样式,支持手动切换主题色,而且很方便使用自定义主题色。

  • 评价:系统出色,界面美观,更新活跃

地址:https://github.com/lin-xin/vue-manage-system


4、iview-admin

基于Vue.js,搭配使用iView UI组件库形成的一套后台集成解决方案,由TalkingData前端可视化团队部分成员开发维护。iView admin遵守iView设计和开发约定,风格统一,设计考究,并且更多功能在不停开发中。

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


5、vuestic-admin

一个响应式的仪表盘模板,采用Bootstrap 4和Vue.js构建。这个精美的管理台模板提供了自定义元素组件,如地图,聊天,个人资料卡,图标,进度条等,以及用于登录和注册的预建页面。

地址:https://github.com/epicmaxco/vuestic-admin


6、d2-admin

基于 vue.js 和 ElementUI 的管理系统前端解决方案 。

D2Admin 是一个完全 开源免费 的企业中后台产品前端集成方案,使用最新的前端技术栈,已经做好大部分项目前期准备工作,并且带有大量示例代码,助力管理系统敏捷开发。

地址:https://github.com/d2-projects/d2-admin

排名前10的vue前端UI框架框架值得你掌握

文章来源:企鹅号 - 编程微刊

公众号回复【520】,送你的神秘大礼包

最近在逛各大网站,论坛,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是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。全面、灵活且强大的ui组件,API友好。

  • 发表于: 2018-08-29
  • 原文链接:https://kuaibao.qq.com/s/20180829G1VG9N00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

推荐几款Vue后台管理系统的框架,以便备用的更多相关文章

  1. 【转】推荐10款最热门jQuery UI框架

    推荐10款最热门jQuery UI框架 原创 在进行Web开发时,并非所有的库都适合你的项目,但你仍需要收藏一些Web UI设计相关的库或框架,以在你需要的时候,加快你的开发效率.本文为你推荐10款非 ...

  2. 推荐几个Laravel 后台管理系统

    小编推荐几个Laravel 后台管理系统 由百牛信息技术bainiu.ltd整理发布于博客园 一.不容错过的Laravel后台管理扩展包 —— Voyager 简介Voyager是一个你不容错过的La ...

  3. vue后台管理系统权限处理

    vue后台管理系统权限 1.权限问题:用户和管理员进入管理系统看到的模块是不一样的,管理员看的的要比用户看到的多.需要用到动态加载路由,router.addRouters()来动态的挂载路由 // 1 ...

  4. VUE 后台管理系统权限控制

    谈一谈VUE 后台管理系统权限控制 前端权限从本质上来讲, 就是控制视图层的展示,比如说是某个页面或者某个按钮,后端权限可以控制某个用户是否能够查询数据, 是否能够修改数据等操作,后端权限大部分是基于 ...

  5. vue后台管理系统——项目优化上线

    1. 项目优化 项目优化策略: 使用进度条nprogress 生成打包报告 第三方库启用 CDN Element-UI 组件按需加载 路由懒加载 首页内容定制 ① 使用进度条nprogress 在页面 ...

  6. vue后台管理系统——登录/退出功能

    电商后台管理系统的功能--登录/退出功能 1. 登录业务流程 ① 在登录页面输入用户名和密码 ② 调用后台接口进行验证 ③ 通过验证之后,根据后台的响应状态跳转到项目主页 2. 登录业务的相关技术点 ...

  7. 推荐25款实用的 HTML5 前端框架和开发工具【下篇】

    快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5.HTML5 有许多新的特性功能,允许开发人员和设计师创建应用程序和网站,带给用户桌面应用程序的速度,性能和体验. ...

  8. vue后台管理系统——数据统计模块

    电商后台管理系统的功能--数据统计模块 1. 数据统计概述 数据统计模块主要用于统计电商平台运营过程的中的各种统计数据,并通过直观的可视化方式展示出来,方便相关运营和管理人员查看. 2. 用户来源数据 ...

  9. vue后台管理系统——订单管理模块

    电商后台管理系统的功能--订单管理模块 1. 订单管理概述 订单管理模块用于维护商品的订单信息, 可以查看订单的商品信息.物流信息,并且可以根据实际的运营情况对订单做适当的调整. 2. 订单列表 在c ...

  10. vue后台管理系统——商品管理模块

    电商后台管理系统的功能--商品管理模块 商品管理概述 商品管理模块用于维护电商平台的商品信息,包括商品的类型.参数.图片.详情等信息. 通过商品管理模块可以实现商品的添加.修改.展示和删除等功能. 1 ...

随机推荐

  1. .NET开源功能强大的串口调试工具

    前言 今天大姚给大家分享一款.NET开源的.功能强大的串口调试工具:LLCOM. 工具介绍 LLCOM是一个.NET开源的.功能强大的串口调试工具.支持Lua自动化处理.串口调试.串口监听.串口曲线. ...

  2. RocketMQ(1) 基础介绍和单机-集群安装

    1. MQ简单介绍 1.1 应用场景 应用解耦 系统的耦合性越高,容错性就越低.以电商应用为例,用户创建订单后,如果耦合调用库存系统.物流系统.支付系统,任何一个子系统出了故障或者因为升级等原因暂时不 ...

  3. Codeforces Round 734 (Div. 3)B2. Wonderful Coloring - 2(贪心构造实现)

    思路: 分类讨论: 当一个数字出现的次数大于等于k,那么最多有k个能被染色, 当一个数字出现的次数小于k,南那么这些数字都可能被染色 还有一个条件就是需要满足每个颜色的数字个数一样多,这里记出现次数小 ...

  4. C语言之兔子生产问题

    /#include <stdio.h> main() { long fib1 = 1, fib2 = 1, fib;//定义长整型变量,fib1表示当前前一个月的兔子数,fib2表示当前前 ...

  5. 远程服务调用(RPC与Rest本质区别)

    一.背景 远程服务将计算机程序的工作范围从单机扩展到网络,从本地延伸至远程,是构建分布式系统的首要基础.远程服务调用(Remote Procedure Call,RPC)在计算机科学中已经存在了超过四 ...

  6. Kubernetes: kube-controller-manager 源码分析

    0. 前言 在 Kubernetes 架构中,controller manager 是一个永不休止的控制回路组件,其负责控制集群资源的状态.通过监控 kube-apiserver 的资源状态,比较当前 ...

  7. buildFast.js node.js 快速发布到gitee上,这样就不用每次点击,并且自动弹出发布页面,再点击发布,完美!

    buildFast.js node.js 快速发布到gitee上,这样就不用每次点击,并且自动弹出发布页面,再点击发布,完美! const fs = require('fs-extra'); fs.c ...

  8. AAC音频编码之--概念介绍

    一 概念 AAC,全称Advanced Audio Coding,是一种专为声音数据设计的文件压缩格式.与MP3不同,它采用了全新的算法进行编码,更加高效,具有更高的"性价比".利 ...

  9. day10-中文乱码处理

    中文乱码处理 1.问题抛出 当表单提交的数据为中文时,会出现乱码: (1)Monster.java: package com.li.web.datavalid.entity; import org.h ...

  10. KTL 最新版

    K,K线,Candle蜡烛图. T,技术分析,工具平台 L,公式Language语言使用c++14,Lite小巧简易. 项目仓库:https://github.com/bbqz007/KTL Core ...