![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
element-ui
文章平均质量分 52
Program W
这个作者很懒,什么都没留下…
展开
-
bpmn-process-designer基础上进行自定义样式(工具、元素、菜单)
处理思路可以看到工具区就是基本样式,所以在此基础上加一个class就ok了找到自定义工具,red是我们自己添加的可以用于左边工具区palette和下拉菜单popup-menu在index.scss添加colorred!important;}//gatewaydisplaynone!important;}效果通过使用自定义渲染我们可以看到初始样式的设置//设置初始样式配置(stroke线条、fill填充内部、label就是图形内部那个文本)constconfig={...原创 2022-07-29 15:13:48 · 2651 阅读 · 0 评论 -
开源项目bpmn-process-designer跑通与引入记录
先克隆项目跑跑推荐用yarn(并行下依赖,快许多【几十秒就搞定了,想起之前的痛苦时光,还中途各种异常下不到┭┮﹏┭┮】)记得配置环境变量(要重启电脑)原创 2022-06-16 14:59:16 · 3339 阅读 · 0 评论 -
element+vue全屏与退出全屏(监听ESC改样式)
一、design.jsfunction toggle(ele, that, exitFullScreen, fullScreen) { if (that.isFullScreen) { exitFullScreen() that.isFullScreen = false } else { fullScreen(document.getElementById(ele)) that.isFullScreen = true }}export default原创 2022-04-24 16:08:37 · 575 阅读 · 0 评论 -
el表格头部拼装,filter+map的结合使用
一、场景像navicat查数据一样,select * from user;这样的数据,但因为是业务涉及修改数据表元数据,所以需要过滤离线的数据表元数据,然后保留在线表的字段拼接到列上。二、代码先过滤筛选出id为null(即在线)的字段,然后拿到它的字段名,最后拼接(ELM-UI)el-table所需的columnsif(res.list.length === 0) { // 无数据时初始化头部列,过滤离线字段 const arr =原创 2022-02-09 10:34:10 · 684 阅读 · 0 评论 -
el+vue双向绑定table异常记录、string对象(json数据)的解析与重组(多k-v)动态表单
一、双向绑定table组件异常说说问题:在调接口获取到数据后直接给this.xxx双向绑定(即table中使用input组件v-model)没什么问题…但是,我需要先动获取到的数组拿到里面的string对象(比如param: "{\"前缀\":\"xx\"}"),需要通过JSON.parse()解析出来,然后通过Object的keys()和values()获取到其中的k-v-----正因如此,尝试了习惯的foreach、for...of,都导致绑定异常(异常是:在input输入数据后【无法看到输入原创 2021-12-07 18:26:52 · 1055 阅读 · 0 评论 -
饿了ui多form时提交,对rules判空处理,及处理时foreach和for...of差异,文件上传formData
一、多form提交业务逻辑问题是:一个表单提交、另一个是文件上传。导致了===》rules虽然提示了,但是没有拦截住文件上传的提交二、处理校验以及foreach和for...of差异获取rules的keyconst vali = Object.keys(this.rules)为什么选这两种呢?因为要遍历对象,需要key,所以用这两种简单一点先尝试foreachvali.forEach(e => { if(this.mdInfo[e] === '')原创 2021-11-18 14:59:33 · 91 阅读 · 0 评论 -
element-ui单文件上传以后,必须刷新(不操作刷新的解决)才能再次上传文件
问题描述 使用element-ui的上传文件组件写一个批量导入,但是发现每次打开上传文件,只有进入页面第一次点击上传文件才调用上传接口,进行文件上传,前思后想,外加百度查询,我解决了这个问题。先上个图片看看问题:下边图片是上传时候打印出来的,当再次上传,没有打印东西,也就是说没有调用上传文件接口 原因 单文件上传以后,data中的fileList,已经放入一个文件了,当你再次上传,并没有清楚本文件或者覆盖上一个文件,导致上传行为并没有执行。 解决办法 上...转载 2021-09-30 11:29:28 · 2238 阅读 · 0 评论 -
解决表格中动态el-input(focus、blur异常)(涉及vue、document以及原生div属性操作)
一、异常来源最初,本来需求,就简单的在表格的输入框失去聚焦的时候(或值改变的时候)进行规范校验,然后根据校验对其进行聚焦focus()事件(并给出message提示)。结果却发现如此坑爹之处:二、解决思路与步骤用vue获取ref,进行focus,没啥用用document,因为是table组件中的input,使它,聚焦的时候是整列,使其在tab(键盘tab)操作时,会去下一行同列给每个el-input动态设置id,然鹅,发现聚焦实在element封装的最外层div元素上然后原创 2021-09-29 13:18:50 · 3193 阅读 · 0 评论 -
前端element组件样式修改思路
一、选择组件这里用el-timeline时间线来举例<template> <div class="block"> <el-timeline> <el-timeline-item v-for="(activity, index) in activities" :key="index" :icon="activity.icon" :type="activity.type"原创 2021-09-18 09:29:48 · 1513 阅读 · 0 评论 -
文字提示(Element UI的Tooltip、原生Html自带的)
文章目录一、Element UI的Tooltip二、Html的文字提示一、Element UI的Tooltip这是tooltip的使用,但是它需要按钮,很不方便<el-tooltip class="item" effect="dark" content="Bottom Center 提示文字" placement="bottom"> <el-button>下边</el-button> </el-tooltip>原创 2021-08-05 14:51:55 · 1632 阅读 · 1 评论 -
纯前端通过虚构<a>实现下载,element-ui实现的上传回显
下载字符串数据的实现<el-button size="small" @click="downloadBpmn">导出</el-button>这是js的写法sleep (time) { return new Promise((resolve) => setTimeout(resolve, time)); },downloadBpmn() { this.$refs.bpmn.saveXml(); this.sleep(100).原创 2021-07-28 11:32:20 · 138 阅读 · 0 评论 -
element-ui中多级联动的用法(select、cascater、tree)
一、三个以内,两个时(el-select)<template>=============同个两个@change实现父子孙的三级联动================== <el-form :inline="true"> <el-form-item label="下拉1"> <el-select v-model="selectData.com1" placeholder="请选择1" clear原创 2021-07-01 17:07:29 · 4263 阅读 · 0 评论 -
element-ui的学习
一、form表单首先需要在 el-form 中 通过 ref 对当前表单进行标记!通过 this.$refs来获取验证的是哪个表达! validate 回调函数 ! valid 表示的是 表单中的参数是否填写完整! 如果 !valid 不完整,则 return 出去,不再往下执行! 如果填写完整 则 调用接口!通过ref标记的表单,可以通过弹框的确定按钮的方法调用$refs.标记名.submit()方法...原创 2021-06-30 17:47:36 · 55 阅读 · 0 评论