第三方组件库记录

乐飞鱼～万维网

已于 2023-09-28 16:56:17 修改

阅读量239

点赞数

分类专栏： elementui jeecg低代码平台文章标签： javascript 前端 html5 npm

于 2022-07-21 17:17:13 首次发布

本文链接：https://blog.csdn.net/u010459196/article/details/125916653

版权

elementui 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

jeecg低代码平台

1 篇文章 0 订阅

订阅专栏

Day.js是一个极简的JavaScript库，可以为现代浏览器解析、验证、操作和显示日期和时间：

Day.js中文网 (fenxianglu.cn)

流程图绘制

介绍 | LogicFlow (logic-flow.org)

Drawer 抽屉：

组件 | Element

一套高质量的微信小程序 UI 组件库：

组件库 | 微信小程序

视频直播：

弹幕组件

video视频播放组件

走马灯t

拖拽:

vuedraggable -- npm组件

图形校验

验证码

类似excel组件

table可以合并--右键快捷菜单

低代码平台-（实用性高）

JEECG官方网站 - 基于BPM的低代码开发平台d

JEECG菜单页面跳转配置（注意在系统菜单-角色管理授权）

代理必须：

非第一个以http开头。如文章所说

(27条消息) 浅析vue cli的webpack配置属性 devServer 详解和 devServer.proxy 工作原理解析_devserver proxy实现原理_火兰的博客-CSDN博客

系统菜单：

系统菜单配置好后，必须去角色管理授权才生效, 路由白名单src/permission.js

permission.js:权限管理文件以及路由守卫，路由白名单配置就在这文件(比如BI不需要登录可以在这里加入白名单，路由切换就不会进行登录校验)。

数据字典：

我测试新增了一个，每次数据字典更新必须，退出登录，重新输入密码，再登陆方可生效（接口规则应该是登录就调用一次）

数据字典接口获取src/utils/dictOptions.js, key为数据字典名称，编码

j-dict-select-tag

dictCode为对应字典编码可以在数据字典菜单查询到

 <j-dict-select-tag type="list" v-model="model.brandStatus" dictCode="wms_brand" placeholder="请选择" />

j-popup

code为在线开放=》Online报表配置获取数据库表，org-fileds为接口返回字段取值，dest-fields为当前页面data()数据表绑定值，顺序对应如depart_name对应sysOrgName 其中code为弹出层，编码字段

<j-popup
                        v-model="model.sysOrgName"
                code="query_sys_depart"
                org-fields="depart_name,org_code,depart_id,org_code,depart_name"
                dest-fields="sysOrgName,sysOrgCode,deptId,deptCode,deptName"
                field="popup"
                :width="800"
                @input="popupCallback"
              />

j-upload

 <j-upload   class="file-uploader"
                      :isMaxShowUploadIcon="true"  :uploadDrager="true"                   
                      fileType="all"
                      v-model="model.agreementList"
                      :multiple="true"
                      :number="60"
                      @uploadDone="avatarUploadDone"
                    >
                      <p class="ant-upload-drag-icon">
                        <a-icon
                          type="cloud-upload"
                          :class="{ disabledContract: 'disabledContractClass' }"
                        />
                      </p>

                      <p class="ant-upload-hint">点击或将文件拖拽到这里上传</p>
</j-upload>

j-super-query

<j-super-query
              
              :fieldList="superFieldList"
              ref="superQueryModal"
              @handleSuperQuery="handleSuperQueryFun"
 ></j-super-query>




fieldList.push({ type: 'Date', value: 'setupTime', text: '成立时间', dictCode: '' })int
      fieldList.push({ type: 'string', value: 'legalRepresentative', text: '法定代表人', dictCode: '' })
      fieldList.push({ type: 'BigDecimal', value: 'registeredCapital', text: '注册资本', dictCode: '' })
      fieldList.push({ type: 'BigDecimal', value: 'contributedCapital', text: '实缴资本', dictCode: '' })
 this.superFieldList = fieldList

图片v-err-img（图片加载失败）

events:自定义事件对象，这个方法功能很强大，可以跨组件跨页面进行通讯，所有继承了这个类的对象都可以通过该对象去调用其中的方法实现灵活的通讯方式，文件有备注，可以查看里面提供的方法，同时此对象已挂载到Vue，页面上可以通过this.$event进行调用。

发送： this.$event.onPublish(主题:string,数据:object);

接收：this.$event.onNotify(主题:string,回调:fn);