简介

Avue是基于Vue.jselement的快速开发框架 它的核心是数据驱动UI的思想,让我们从繁琐的crud开发中解脱出来,它的写法类似easyUI,但是写起来比easyui更容易,因为它是基础数据双向绑定以及其他vue的特性。同时不知局限于crud,它还有我们经常用的一些组件例如,表单,数据展示卡,人物展示卡等,更多的组件还在开发

高级vip群

点击查看详情

百度云课程

avue相关地址

欢迎加入QQ交流群,互相学习

前端avue交流群:606410437

后台微服务群:23754102

服务端解决方案:https://gitee.com/log4j/pig

刚入门的前端小师妹博客:https://my.oschina.net/u/3883702/

最近很多人反应不太会用crud快速开发组件,因此免费推出crud系列的讲解课程,详情请加QQ群

avue综合实际实例

技术文档

源码地址

更新日志

在线demo

使用方式

1.html引入

axios、vue、element-ui相关依赖也要引入
avue-cdn:https://gitee.com/smallweigit/avue/raw/master/lib/avue.js
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/element-ui/2.3.4/index.js"></script>
<script type="text/javascript" src="https://gitee.com/smallweigit/avue/raw/master/lib/avue.js"></script>

2.npm引入

npm install avue-cli

import Avue from 'avue-cli/packages/index.js';

功能结构

- 全局错误日志记录
- vuex持久化存储
- 主题色切换
- 锁屏
- SSR渲染页面
- 数据展示
- 登录/注销
- 用户名登录
- 验证码登录
- 权限验证
- 第三方网站嵌套
- CRUD(增删改查)
- FORM(动态生成)
- 阿里巴巴图标库(在线调用)
- 环境变量
- 表格树
- 引导页
- 数据持久化
- 剪切板
- 系统管理
- 用户管理
- 角色管理
- 菜单管理
- 高级路由
- 动态路由
- 参数路由
- 更多功能开在开发

页面展示

炫彩主题

主题色

本地数据持久化

环境变量

表格树

登录

权限测试页面

数据展示

错误页面

错误日志记录

CRUD


FORM

用户管理

角色管理

菜单设置

阿里巴巴图标库(在线调用)

登录页面SSR渲染

主页

第三方网站

开发

# 克隆项目
git clone https://gitee.com/smallweigit/avue.git # 进入项目
cd avue # 安装依赖
npm install --registry=https://registry.npm.taobao.org # 启动服务
npm run dev

调试与发布

# 构建测试环境
npm run dev # 构建生成环境
npm run build # 构建SSR渲染页面
npm run start

其它

# 代码检测
npm run lint # 单元测试
npm run karma # 构建SSR客户端代码
npm run build:client # 构建SSR服务端端代码
npm run build:server

友情链接

License

MIT

Copyright (c) 2017-present Smallwei QQ:1634566606

avue你繁琐的表格、表单、树等组件开发的解脱工具,了解一下?的更多相关文章

  1. Bootstrap框架(基础篇)之列表,表格,表单

    继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...

  2. HTML--绝对路径, 表格,表单, 框架

    URL, URI, URN URL: 统一资源定位符: Uniform Resource Locator URN: 持久可用的资源标准名称 Uniform Resource Name , 比如邮箱 U ...

  3. HTML表格表单综合——用户注册表

    今天学习了表格和表单知识,我综合了他们添加了一些拓展知识做了一个用户注册表,以下面代码来整理表格和表单知识: <!DOCTYPE html PUBLIC "-//W3C//DTD XH ...

  4. css表格表单和统筹

    css:表格表单和统筹 学习目标 1.表单标签及属性高级 2.表格标签及属性高级 3.CSS统筹 4.BFC概念和应用场景 一.表单标签及属性高级 回顾: 表单的作用:用来收集用户的信息的; 表单的组 ...

  5. 028、HTML 标签3表单标签插入组件

    内容:表单标签插入组件(经常使用)############################################################## form表单标签和input组件 < ...

  6. 第四节:Vue表单标签和组件的基本用法,父子组件间的通信

    vue表单标签和组件的基本用法,父子组件间的通信,直接看例子吧. <!DOCTYPE html> <html> <head> <meta charset=&q ...

  7. vue+element 表单封成组件(1)

    作为一名刚接触vue不到一个月的菜鸟,思想还没有从操作DOM转变为数据驱动,看vue的代码处处别扭.组里为了让我熟悉vue交给了我一个将element 表单封装成组件的练手任务.由于开发过程中遇到的表 ...

  8. CSS3-animation,表格表单的格式化

    animation 1.与transition一样,animation在IE9之前都不支持,不仅如此,还需要大量的供应商前缀 2.定义关键帧:@内容中需要大量的前缀 @keyframes  fadeI ...

  9. bootstrap 列表 表格 表单 复选 单选 多选 输入框组

    一.列表 ul li 二.表格 table  (http://www.runoob.com/bootstrap/bootstrap-tables.html) 1. 基本表格 <table cla ...

随机推荐

  1. Lock Puzzle CodeForces - 936C (构造)

    大意: 给定字符串$s$,$t$, 每次操作可以将$S=AB$变为$S=B^RA$, 要求$3n$次操作内将$s$变为$t$. #include <iostream> #include & ...

  2. redis 学习(10)-- redis 慢查询

    redis 慢查询 什么是慢查询 MySQL会记录下查询超过指定时间的语句,我们将超过指定时间的SQL语句查询称为慢查询,都记在慢查询日志里. redis 的生命周期 客户端向Redis服务器发送命令 ...

  3. O009、KVM 网络虚拟化基础

    参考https://www.cnblogs.com/CloudMan6/p/5289590.html   网络虚拟化是虚拟化技术中最复杂的部分,学习难度最大.   但因为网络是虚拟化中非常重要的资源, ...

  4. laravel 5.7 引入Illuminate\Http\Request 在类内调用 Request 提示不存在的问题

    laravel报错: ReflectionException Class App\Http\Controllers\Request does not exist 解决办法: namespace App ...

  5. 04 Websocket和Websocketed

    一.web socket事件和方法 有了HTTP协议为什么还需要Websocket这种协议呢?因为HTTP协议发起的通信只能通过客户端发起,然后服务端才可以将消息回应到客户端.因此HTTP协议做不到服 ...

  6. 第十三篇 JS 操作table表格

    JS 操作table表格 这节课难度可能高一点,因为没有提前解释if判断.for循环.这节课是直接把这两样用上了,老师先简单介绍一下: if,判断语句,判断就很简单了嘛,假如说1=1(1等于1),当然 ...

  7. Java-日期格式转换

    1.日期-String类型转Date类型 // String转Date str = "2007-1-18"; DateFormat format1 = new SimpleDate ...

  8. 为什么angular library的build不能将assets静态资源打包进去(转)

    Versions Angular CLI: 6.0.7 Node: 9.3.0 OS: darwin x64 Angular: 6.0.3 ... animations, common, compil ...

  9. requests:用于发送http请求,专为人类设计

    介绍 requests模块是一个专门用来发送http请求的模块 如何发送请求 import requests """ 使用requests模块发送请求非常简单 首先请求有 ...

  10. Python名称空间与作用域

    什么是名称空间? 比如下图的长方形代表内存,在这个内存里我要设置一个变量100,那么这个变量得有个门牌号,就叫他a吧,但其实变量不是这么存储的,他其实的存储方式是这样的,他会有一个名称空间,这个名称空 ...