admi后台 vue_GitHub - jiangshanmeta/vue-admin: 基于vue的通用管理后台

vue-admin

本项目提供了一种配置式生成后台页面的方案。

model

model是对一个后台页面的描述，由以下几部分构成

fields 对字段的描述

labelName 字段的名称

validator 表单验证用的，底层依赖async-validator,该配置项支持函数，第一个参数为整条记录，第二个参数为当前模式(create | edit)，用于支付复杂情况的校验，函数返回值是async-validator的验证配置项。这个参数支持一个特殊的值custom,将验证委托给具体的Editor组建，该组建需要实现一个validate方法，该方法组要返回promise。

autoValidate，是否自动表单验证该字段，布尔值或者返回布尔值的函数(函数会被传入一个参数mode，为create或edit)

tip tip用在Editor组件中，用于对应字段做些说明，它可以是一个函数(调用时this指向Editor组件实例，被传入一个参数mode(值为create或edit),其返回值作为显示值)，也可以是个简单值(直接作为显示值)

tableColumnConfig 对应el-table-column的其他配置项一个对象展开传递

pages关联页面的描述

list 列表页配置

collectionOperators 类似于documentOperators，但collectionOperators不针对于一条特定的记录，它对应的data是选中的数据数组。

filters，筛选组件的配置项。

documentOperators/collectionOperators/filterOperators在底层都依赖于Operators

声明了一个model后，我们还需要在vue-router配置中指明用了哪个model，因而用到了vue-router的meta属性。

组件命名规则

整体风格为PascalCase。

本系统把组件分为Editor、Filter、View、Label、DocumentOperator、CollectionOperator、FilterOperator七大类，分属于这七大类的组件应以对应的类型作为组件名前缀。

对于Editor、Filter组件，优先描述数据结构，然后是前端特殊功能，最后是前端展示。

对于只会用一次的组件，采用组件类型+model名+字段名的形式

写model的tip

一般而言，一个model对应和一个后端model(对应一张表)对应，但实际上不一定。

一个model的内容不一定要放在一个文件中，可以放在多个文件中最后组合

一个具体的业务系统可能有非常多的相似配置项，可以写成辅助函数来生成这些配置(类似于redux的action，本身只是对象，但是可以有action creator)

如果通过MetaPage页面级组件使用model, 会默认把model深度freeze优化性能。deepFreeze情况下如果model中有同步引用的组件(不是通过动态import)，需要手动使用Vue.extend转换为Vue子类，否则Vue自动调用extend将配置对象转换为子类时，由于配置对象被冻结转换为子类失败。

admi后台 vue_GitHub - jiangshanmeta/vue-admin: 基于vue的通用管理后台相关推荐

【笔记】Vue Element+Node.js开发企业通用管理后台系统——电子书上传功能开发
文章目录一.创建上传页面组件二.上传组件开发三.上传 API 开发四.上传图书表单电子书上传 | 「小慕读书」管理后台一.创建上传页面组件在前端目录,新建\src\views\book\ ...
Vue Element+Node.js开发企业通用管理后台系统笔记完
第三四章 Vue进阶 emit和emit 和emit和on 用this.$on来定义一个事件, 并且指定事件的执行对象(函数), 他主要是用来干什么的呢 --事件的定义和消费使用this.on来定义 ...
【笔记】Vue Element+Node.js开发企业通用管理后台系统——电子书解析功能开发
文章目录一.电子书解析 1.构建函数 2.从文件创建 Book 对象 3.电子书解析 (1)epub 库集成 (2)使用 epub 库解析电子书 (3)epub 库获取图片逻辑修改 (4)电子书目录 ...
【笔记】Vue Element+Node.js开发企业通用管理后台系统——项目需求分析
文章目录一.项目技术架构 1.三个应用 2.项目目标二.技术难点分析 1.登录 2.电子书上传 3.电子书解析 4.电子书增删改 5.epub 电子书三.Nginx 服务器搭建 1.安装 ngi ...
【实战】Vue Element+Node.js开发企业通用管理后台系统——Vue进阶（下）
文章目录一.组件通信 provide 和 inject 二.过滤器 filter 三.监听器 watch Watch 用法1:常见用法 Watch 用法2:绑定方法 Watch 用法3:deep + ...
基于likeadmin通用管理后台搭建—高校科研管理系统
前言 likeadmin是一款免费开源的通用后台框架系统,可以快速开发前后业务.代码生成器.API模块.uniapp端都已具备,下面是基于likeadmin通用管理后台搭建的-高校科研管理系统产品背 ...
推荐一款优秀的通用管理后台
最近看到一款优秀的通用管理后台--likeadmin,推荐给大家.likeadmin的部署方式简单,界面美观,基于MIT协议,完全免费,非常值得一用. likeadmin快速开发通用管理后台,基于Vu ...
Artiely Vue Admin - 基于蚂蚁金服Ant Design构建的高颜值开源管理后台UI框架
继承 Ant Design 专业美观的优点,支持PC/手机/平板的响应式布局的优秀后台管理系统 UI 框架. 关于 Artiely Vue Admin Ant Design 是阿里巴巴蚂蚁金服团队出品 ...
实战Vue：基于Vue的移动端购物商城
前情提要:文章很长,基本是整个项目完整开发的流程.代码下载后可以直接运行,支付接口慎用,可能会有错误,其他功能都是完整的. 完整项目下载关注一下公众号「代码行间」,回复「商城」可以获取代码- 一.项 ...

admi后台 vue_GitHub - jiangshanmeta/vue-admin: 基于vue的通用管理后台

admi后台 vue_GitHub - jiangshanmeta/vue-admin: 基于vue的通用管理后台相关推荐

最新文章

热门文章