大前端
文章平均质量分 62
Program W
这个作者很懒,什么都没留下…
展开
-
Vue实现Antv/X6中的示例,以及一些er图开发场景
Vue实现Antv/X6中的示例,以及一些er图开发场景。已实现ER、 BPMN、 UML、 思维导图、 自定义功能。原创 2023-08-31 10:20:45 · 2074 阅读 · 0 评论 -
[eslint] Delete `CR` [prettier/prettier]
Prettier和ESLint结合使用时,于是代码运行时因为与项目创建者产生crlf和cr差别,eslint检测会出来以至于无法启动以及全面爆红。原创 2023-07-25 10:49:55 · 1836 阅读 · 0 评论 -
TypeScript快速入门
此外,它还支持更复杂的类型,如数组、元组、枚举、对象等。文件,根据该文件的配置进行编译,默认情况下,如果该文件没有任何配置,TS编译器会默认编译项目目录下所有的。在TS的项目中,TS最终都会被编译JS文件执行,TS编译器在编译TS文件的时候都会先找项目根目录的。的缩写,即 TypeScript 编译器,用于将 TS 代码编译为 JS 代码。是TypeScript项目的配置文件,用于指定TypeScript编译器的选项和行为。TypeScript支持类的概念,它允许你使用面向对象的编程方式。原创 2023-07-24 11:25:37 · 780 阅读 · 1 评论 -
CSS面试常问知识点
BFC、IFC、GFC 和 FFC 是 CSS 中的布局概念,它们分别代表块级格式化上下文(BFC)、内联格式化上下文(IFC)、网格格式化上下文(GFC)和自适应格式化上下文(FFC)。要用 CSS 实现一个三角形,可以借助 CSS 的边框和尺寸属性来创建一个没有内容区域的块元素,然后通过设置边框的颜色和宽度来形成三角形的样式。你可以根据需要调整 border 的宽度和颜色,以及元素的宽度和高度,来创建不同尺寸和样式的三角形。是根据元素的样式属性重新绘制元素的外观,不涉及页面布局的改变。原创 2023-06-15 10:58:52 · 1170 阅读 · 0 评论 -
Javascript面试常问知识点
闭包(Closure)是指一个函数能够访问并操作其词法作用域外部的变量的能力。具体来说,闭包是由函数以及函数内部能够访问的变量组合而成的包裹(Closure)。函数内部可以访问外部函数的变量和参数。外部函数执行完毕后,其内部变量不会被销毁,仍然可以被内部函数访问。闭包可以捕获并保存外部函数的作用域,使得外部函数的变量在内部函数执行时仍然可用。保护变量:闭包可以保护变量不被外部访问和修改,实现了数据的私有化,增加了程序的安全性。原创 2023-06-14 11:50:55 · 1248 阅读 · 0 评论 -
移除vue生产环境console.log,并本地打包测试
移除vue生产环境console.log原创 2022-12-07 11:58:36 · 350 阅读 · 0 评论 -
Vue2实现vue-cron回显以及一些自适应改动
【代码】Vue2实现vue-cron回显以及一些自适应改动。原创 2022-11-28 11:13:06 · 1718 阅读 · 0 评论 -
Vue3封装exceljs导出数据与图片组件
原版:使用exceljs读取和导出Excel并支持图片导出2、组件二、使用示例:导出按钮组件:echarts图2.1导出效果原创 2022-11-28 09:41:11 · 1428 阅读 · 0 评论 -
antv/g6全屏【canvas】记录
100%网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth (包括边线和滚动条的宽)网页可见区域高:document.body.offsetHeight(包括边线的宽)网页正文全文宽:document.body.scrollWidth网页正文全文高:document.body.scrollHeight。原创 2022-11-22 10:31:11 · 1498 阅读 · 0 评论 -
antv系列图引擎X6、G6比对选择,并实现vue实例ER图
官方示例中是(使用String自定义 ToolBar 功能)但是,看了文档,我们还可以使用使用DOM自定义 ToolBar 功能// 工具栏 const toolbar = new G6 . ToolBar({// 渲染自定义节点---组件 const outEl = document . getElementById('toolbar') return outEl } , position : {官方示例注册的自定义边没有提供连线,所以我们如果有需要则得在方法中自己定义连线中途的图形制作默认。原创 2022-11-16 18:19:20 · 4474 阅读 · 0 评论 -
antV/X6学习---官网实例vue实现
antV/X6学习---官网实例vue实现原创 2022-07-29 15:21:51 · 2460 阅读 · 0 评论 -
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 · 2567 阅读 · 0 评论 -
JS使用Puppeteer自动化进行浏览器操作记录,js执行py脚本
二、网页截图加载完页面后,对页面进行截图方法基本截图全屏截图参数四、自动化操作自动CSDN五、通过脚本方法截取指定元素的图Puppeteer中文API文档原创 2022-07-14 12:01:48 · 1043 阅读 · 0 评论 -
canvas属性方法记录
三、基本图形属性、方法属性:线的粗细:线的颜色:线条连接(拐角)的样式:直线两端(线帽)样式:设置描边的属性(颜色、渐变、图案)【必须在前面,不然样式不生效。】:设置填充的属性(颜色、渐变、图案)【必须在前面,不然样式不生效。】方法,取一个点,由点出发一条直线,将起点和终点连接起来(描边),手动闭合拐点(在直线宽度较大时无法很好的闭合最终拐角),重新开启一个路径(第一条线的样式会影响之后的线,所以必须设置新线段的样式):从原始画布剪切任意形状和尺寸的区域。(该方法后的图形设原创 2022-07-06 17:17:16 · 615 阅读 · 0 评论 -
开源项目bpmn-process-designer跑通与引入记录
先克隆项目跑跑推荐用yarn(并行下依赖,快许多【几十秒就搞定了,想起之前的痛苦时光,还中途各种异常下不到┭┮﹏┭┮】)记得配置环境变量(要重启电脑)原创 2022-06-16 14:59:16 · 3326 阅读 · 0 评论 -
微应用部署环境下,子应用无法访问(问题记录),try_files详解
微应用部署问题原创 2022-06-14 16:09:55 · 712 阅读 · 0 评论 -
组合式 API----Vue3学习
一、API风格选项式 API 和组合式 API。选项式 API(也就是Vue2时的写法)使用选项式 API,我们可以用包含多个选项的对象来描述组件的逻辑,例如 data、methods 和 mounted。选项所定义的属性都会暴露在函数内部的 this 上,它会指向当前的组件实例。实际上,选项式 API 也是用组合式 API 实现的!<script>export default { // data() 返回的属性将会成为响应式的状态 // 并且暴露在 `this` 上原创 2022-05-30 16:21:13 · 677 阅读 · 0 评论 -
React入门
文章目录一、环境一、环境HTML(即模板引擎的时候)可以使用cdn<script src="https://unpkg.com/react@16/umd/react.development.js"></script><script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script><!-- 生产环境中不建议使用 --><scri原创 2022-04-30 17:24:40 · 311 阅读 · 0 评论 -
记录Error: Cannot find module ‘less‘(webpack和less-loader版本处理)
原文:Vue安装loader报错:Syntax Error: Error: Cannot find module ‘less‘ 1.Vue组件中写了less 运行报错 2.提示我应该安装一个loader 然后执行了 npm i less-loader 运行之后还是报错: &nbs转载 2021-10-08 14:24:17 · 1918 阅读 · 0 评论 -
Vue修改node_modules插件下dist中的样式
一、修改样式的思路(js的想法)今天突然遇到一个要改bpmn源码中样式的需求,但是又不能直接去改源码打成dist包中的样式,node_module下改了也没啥用。于是想起了用js操作节点来修改样式。1.1、首先是getElementsByClassName()代码这样document.getElementsByClassName('group-closed').length1.先获取折叠了的group,2.通过获取它的长度才能获得它折叠后的第一个样式再进行修改。3...结果发现没办法原创 2021-08-06 22:09:18 · 1203 阅读 · 0 评论 -
Vue动态表单---Variant Form代码学习(Vue内置组件)
一文彻底搞懂ConcurrentHashMap原理 ...原创 2022-03-30 11:07:06 · 4947 阅读 · 0 评论 -
el-table通用弹窗表格【单选用户】(懒加载及其过滤)
一、单选表格用户框架是MyUI代码<my-table fit toolbar :size="'small'" ref="tables" :columns="columns" :pagination="{ layout: 'total, sizes, ->, prev, pager, next, jumper' }" :loader="loader" :pa原创 2022-03-30 10:21:13 · 446 阅读 · 0 评论 -
js更少的代码处理数组的取最小、大值(sort、math【ES5/6】)
一、for循环const arr = [33, 4, 9]let max = arr[0];for (let i = 0; i < arr.length - 1; i++) { max = max < arr[i+1] ? arr[i+1] : max}let min = arr[0]; for (let i = 0; i < arr.length - 1; i++) { min = min > arr[i + 1] ? arr[i + 1]原创 2022-03-08 09:40:49 · 202 阅读 · 0 评论 -
Vue.mixin()+全局混入插件+this.$optiosn获取初始化选项+局部混入
一、概述Vue.mixin( mixin )用法:全局注册一个混入,影响注册之后所有创建的每个 Vue 实例。插件作者可以使用混入,向组件注入自定义的行为。不推荐在应用代码中使用。https://cn.vuejs.org/v2/api/#Vue-mixin生命周期https://cn.vuejs.org/v2/guide/instance.html#%E5%AE%9E%E4%BE%8B%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E9%92%A9%E5%AD%9原创 2022-03-01 10:22:46 · 686 阅读 · 0 评论 -
npm打包发布记录
一、登录注册需要注意的是:有个验证邮箱需要点击才能发布(不然会影响后续,导致发布不成功)二、项目构建初始化# 整个小js第一次发布vue init webpack-simple project-name# 都懂npm i项目(保留一个第一次试试就可以了)随便弄个验证(这里是做个插件install)export default { install: function (Vue, options) { // 邮箱验证 Vue.prototype.$is原创 2022-02-15 17:49:11 · 577 阅读 · 0 评论 -
前端代码格式化VSCode,插件Volar,配置默认格式化程序
一、概述vscode复制代码十分乱格式,但是需要搭配一个好的格式化程序(插件),这里选择Volar(一个标签属性多了就会帮你自动换行。就很棒)二、使用可以看到有两个Volar(Vue2选择下面的)Ctrl+Shift+F(格式化快捷键)配置默认(第一次选错了,通过这个操作重新配【爬坑的难受┭┮﹏┭┮】)...原创 2022-02-15 12:04:34 · 20552 阅读 · 6 评论 -
若依RuoYi-Cloud代码学习一---项目启动
一、环境若依官网文档-环境部署部分JDK >= 1.8 (推荐1.8版本)Mysql >= 5.7.0 (推荐5.7版本)Redis >= 3.0Maven >= 3.0Node >= 12nacos >= 1.1.0 (ruoyi-cloud >= 3.0.0需要下载nacos >= 2.x.x版本)sentinel >= 1.6.0我这用的mysql8开始前准备好nacos、redisnacos启动主要原创 2022-02-14 19:18:16 · 1710 阅读 · 0 评论 -
vue+monato-editor代码编辑高亮,sql变化监听(组件化)-->优化具体语言引入
一、概念Monaco Editor 是支持VS Code的代码编辑器 。描述代码编辑器功能的好页面在 这里。它在 MIT 许可下获得许可,并支持 Edge、Chrome、Firefox、Safari 和 Opera。移动浏览器或移动 Web 框架不支持 Monaco 编辑 器。microsoft/monaco-editor代码仓库二、使用步骤引用依赖package.json,添加"monaco-editor": "^0.21.2","monaco-editor-webpack-原创 2022-01-25 14:38:14 · 3085 阅读 · 0 评论 -
js的闭包(Closure)是什么?【隐藏一个变量,间接访问它】
什么是「闭包」。「闭包」的作用是什么假设上面三行代码在一个立即执行函数中(为简明起见,我就不写立即执行函数了,影响读者理解)。三行代码中,有一个局部变量 local,有一个函数 foo,foo 里面可以访问到 local 变量。好了这就是一个闭包:「函数」和「函数内部能访问到的变量」的总和,就是一个闭包。就这么简单。有的同学就疑惑了,闭包这么简单么?「我听说闭包是需要函数套函数,然后 return 一个函数的呀!」比如这样:function foo(){ var local.转载 2021-12-31 17:12:53 · 341 阅读 · 0 评论 -
bpmn-js-properties-panel改造尝试,思路代码(候选人、候选组改为可选【多选】)
一、效果初始时与这个一样,通过输入框通过,分割,(但是事实的业务不可能让用户来自己输入)可以多选xml保存二、思路先找到我们要改造的节点比如候选人candidateUsers看看文件结构,在parts下【其中放了基本是创建元素的操作】简单看看怎么创建元素的找到一个用选择器的元素(确定中的,get和set方法),cmdHelper的update...方法就是让我们保存xml时,会添加activiti:candidateUsers修改我们的Use原创 2021-12-24 14:38:20 · 5067 阅读 · 6 评论 -
vue项目引入iconfont【最简单方便的Symbol引用】(从下载到使用的步骤)
一、首先找到iconfont图标库iconfont-阿里巴巴矢量图标库二、下载图标的步骤先收藏收藏(也叫入库,购物车的图标)添加到项目(这个项目不是只我们开发中的项目,代指而已)先创建项目(代指),在我的项目中(相当于你要用的这些图标在哪个项目中)我的项目这时才有添加的目标库最后下载下来【下载后是个压缩包zip】三、引用到vue项目中的步骤解压,这是解压后的文件,我们用Symbol引用只要用到这个js文件将其放到我们的icons目录下(其他不用管,那是另外两种引原创 2021-12-16 15:14:32 · 2316 阅读 · 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 · 1053 阅读 · 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 评论 -
若依RuoYi-Vue代码学习一---通用分页处理
文章目录一、先运行看看接口到sql二、来看看若依怎么处理的分页三、最后回到接口,及其参数返回一、先运行看看接口到sql随便找个表格看看可以看到传入了,分页关键属性看看debug的日志打印的sql[debug,137] - ==> Preparing: select dict_id, dict_name, dict_type, status, create_by, create_time, remark from sys_dict_type LIMIT ?[debug,137]原创 2021-11-18 14:42:05 · 3680 阅读 · 0 评论 -
若依RuoYi-Vue代码学习一---注解与切面
文章目录一、注解(日志方面)二、面向切面编程三、项目地址一、注解(日志方面)在一个项目中日志还是很有必要的,所以日志的写法,所以这里用操作日志的记录保存来解读。想更了解注解可以看看Java-Java5.0注解解读这个注解用法,即给方法上注解后,再给上参数,然后通过切面编程获取注解上的参数等,进行其他相关处理。注解的使用:@Log(title = "操作日志", businessType = BusinessType.DELETE) @PreAuthorize("@ss.hasPe原创 2021-11-16 09:54:32 · 2632 阅读 · 0 评论 -
electron桌面应用简便使用,一行命令将网站变成桌面应用
个人尝试后说明:打包安装后的启动的样子(还可以(▽)!!!)文档:electron-egg一个入门简单、快速高效、功能丰富的js跨平台桌面软件开发框架。项目地址:giteee,GVP哆啦好梦 / electron-egg开始:先用git,git clone https://gitee.com/wallace5303/electron-egg.git项目拿到,不多说,先npm install将任意网站变成应用的本地链接点遇到问题看着:文档中:常见问题汇总打包 (windows版本)原创 2021-11-09 15:48:42 · 915 阅读 · 0 评论 -
Vue中为动态角色设计动态菜单(并配置动态路由,递归菜单,处理重定向与死循环、push重定向异常捕获)
一、思路动态角色、动态菜单基本都是后端的事情了(两个表的事情)设计方面:动态角色:是配置配置两个权限数组,一个放置当前用户的全部角色,一个放置当前用户的当前角色(即一个时候只能使用一个角色)动态菜单:在每次layout刷新时调当前角色对应的菜单(这个是配置在数据库中,一个角色会给他分配哪些菜单,菜单是由前端先写上全部,然后再自己根据需要来选择)。动态路由:每次获取到菜单时,存入session缓存中,在需要跳转页面时,通过路由守卫(前置)beforeEach,对缓存中的菜单进行递归获取,然后判原创 2021-11-05 16:13:21 · 757 阅读 · 0 评论 -
指定元素全屏与退出全屏,Vue中处理监听esc并修改data数据(监听与作用域问题)
文章目录一、效果二、解决思路三、全屏与退出全屏一、效果解决的问题:vue本身监听不到全屏状态中的esc事件,导致无法修改这个按钮的样式icon和tooltip未全屏时:全屏时:二、解决思路一个重要方法:判断当前是否全屏问题:如果vue本身的话,在esc事件时是不会调用这个方法的/**浏览器当前是否全屏@return {*|boolean}*/export function isFullScreen() {return document.isFullScreen |原创 2021-11-05 15:53:24 · 929 阅读 · 3 评论 -
处理饼图难以绑定调用接口后的数据(then作用域外使用其中的数据)
一、说下我们这个pie(饼图坑爹之处)它有两种data绑定方式直接绑定到data里<my-chart-pie :data="pieData" style="height:330px" >data() { return { pieData: { columns: ['渠道', '访问量'], rows: [ ['直接访问', 320], ['邮件营销', 302], [原创 2021-10-11 11:35:39 · 306 阅读 · 0 评论 -
element-ui单文件上传以后,必须刷新(不操作刷新的解决)才能再次上传文件
问题描述 使用element-ui的上传文件组件写一个批量导入,但是发现每次打开上传文件,只有进入页面第一次点击上传文件才调用上传接口,进行文件上传,前思后想,外加百度查询,我解决了这个问题。先上个图片看看问题:下边图片是上传时候打印出来的,当再次上传,没有打印东西,也就是说没有调用上传文件接口 原因 单文件上传以后,data中的fileList,已经放入一个文件了,当你再次上传,并没有清楚本文件或者覆盖上一个文件,导致上传行为并没有执行。 解决办法 上...转载 2021-09-30 11:29:28 · 2223 阅读 · 0 评论