自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(121)
  • 收藏
  • 关注

原创 hover显示播放遮罩层效果

点击,跳转到对应的视频播放页。这是目前主流视频网站的一个通用效果。我们都知道视频列表其实是一个封面列表,鼠标放上去时,有反馈:即。为了做出这个效果需要准备1张封面图片和1个播放按钮icon。如有任何疑问或者想实现什么效果,欢迎评论区交流。注:vue版本"^3.4.15"先来看下实现之后的效果。

2024-04-24 16:09:39 128 1

原创 图片hover放大效果

一张图片,鼠标放上去时,出现放大效果。非常简单,两个关键词:hover和transform

2024-04-24 13:57:51 176

原创 vue3项目配置按需自动导入API组件unplugin-auto-import

将vue、vue-router等的import语句删除,项目正常启动不报错。这款插件是前端大神Anthony Fu写的,非常实用。unplugin-auto-import的git地址。有兴趣的小伙伴可以到git上看,

2024-02-19 17:39:28 1853

原创 vue3项目配置按需自动引入自定义组件unplugin-vue-components

Anthony Fu,在Git上的账号是antfu,是Vue和Vite核心成员,同时也是VueUse、Slidev几个开源项目的作者……,他的一些插件都是非常非常实用的!我们通常在项目中,需要手动引入自定义的各种组件,如果涉及的页面功能比较多的话,光是import的长度都能赶上春联了。这就是前端大神Anthony Fu写的的非常好用的插件,其实已经被vite官方收录了。将你引入自定义组件的import*****之类的语句,去掉,依旧正常运行。如果,能有一个插件帮我们实现自动引入,是不是要谢天谢地了呢?

2024-02-19 15:27:47 1153

原创 unplugin-vue-components解决命名冲突

大概就是这样啦,至于到底要不要设置directoryAsNamespace​​​​​​​为true,就看你个人习惯啦。注:vue+ts项目,dts属性默认为true,因此在你不留意时,它就自动生成啦。将会自动生成components.d.ts文件,1同名加路径前缀,不同名也要加路径前缀。false时,就要多花点脑细胞想名字。如果有任何,欢迎友友们评论区留言……这几种情况,看一下,你应该就理解啦。true时,就需要引用时多敲点代码。当出现同名文件时,该怎么解决呢?下图这个例子,我用不同颜色区分了。

2024-02-19 15:23:48 834

原创 利用vite快速搭建vue3项目

然而,有些模板需要依赖更高的 Node 版本才能正常运行,当你的包管理器发出警告时,请注意升级你的 Node 版本。之后我们将一步一步给这个框架基底添加基础的好用的工具,以便快捷开发。4、之后根据你的编码习惯或需要,选择【ts】或者【js】,点回车。3、回车之后,出现选择框架的提示,我们选择【vue】回车。1、选择一个文件夹,在vscode终端打开,输入命令【6、【cd rookiedemo】进入对应的工程目录。2、提示你输入项目名称之后,我这里设置的是【5、vite非常贴心,按照对应的提示,即可。

2024-02-19 11:20:07 384

原创 npm淘宝镜像过期报错request to https://registry.npm.taoba*** failed, reason: certificate has expired

嗨,各位程序员小伙伴,龙年春节过得怎么样了呢?好久好久没有敲代码啦,今天准备试手,结果发现报如下错啦英文不太好的我,居然这次看懂啦certificate has expired 证书过期于是求助度娘,果然有C站大神相助,方化险为夷用【npm config list】查看相关配置发现我之前使用的确实是老的镜像【https://registry.npm.taobao.org/】接着我们从老的镜像,切换到新的镜像【https://registry.npmmirror.com】

2024-02-18 16:32:25 4420 1

原创 原生video设置控制面板controls显示哪些控件

其实我觉得,基本上原生提供的功能已经满足日常使用了,除非你的需求的重度视频功能,然后对美观度有一定要求,如各大视频网站爱优腾+B。

2023-12-01 11:06:35 1680

原创 css实现渐变电量效果柱状图

如果你只是想做一个静态demo,不需要数据,不需要后台,这里教你一个简单快捷的方法,用css实现!我们通常的做法就是用echarts来实现。其实思路是一致的,就是效果层的叠加。以上,就是在项目中实际会用到的效果。接着是又在渐变的基础上,接着我们实现进阶版,

2023-09-25 15:53:49 747 2

原创 error:03000086:digital envelope routines::initialization error

vue前端项目命令框输入npm run serve报error:03000086:digital envelope routines::initialization error错误 原因:node版本过高 解决办法: 在命令行输入命令修改环境变量:$env:NODE_OPTIONS="--openssl-le…前端vue项目启动突然报错error:03000086:digital envelope routines::initialization error。然后就是寻求度娘帮助。

2023-09-05 11:24:13 943

原创 echarts实现渐变电量效果柱状图

例子中,过程已经讲得比较详细了,所以这里就不再重复说了,直接贴全部代码。相比于普通的柱状图,这里边最明显的区别在于多了。如果你耐心看完,并理解了对应的图层叠加思路↓。以上代码实现了官网示例与最终效果的对比。先引入一个两层叠加的例子。那么就能很容易想到,

2023-06-15 16:24:07 444

原创 echarts分割柱形图实现渐变电量效果柱状图

先看下效果图是这个样子的 ,和普通的柱状图最明显的区别就是需要做成类似于电池格电量显示效果。

2023-06-15 10:04:59 1276 4

原创 echarts象形柱图实现电量效果柱状图

改造的基本思路:将type由bar变为pictorialBar,再修改设置与pictorialBar相关的配置项即可。看到这几种标记类型还不是很抽象,没关系,我们一个一个看下效果。a.type由bar变为pictorialBar,效果如下。看了这么多,那么我们要用到的是哪一个呢?看下官网例子,你就大概明白每个配置项能实现的效果了,接着再改变一下颜色,设置一下label就完成了。为什么是椭圆效果呢?我们去官网配置项中找答案,因此我们设置一下想要实现效果的配置项。但是,还有一个小细节需要注意,

2023-06-14 17:17:57 1481

原创 运行 ‘ApplicationCustomer‘ 时出错: 命令行过长。要为 ApplicationCustomer 或也为 Spring Boot default 配置 缩短命令行吗?

springboot启动项目时报错:命令行过长。要为 ApplicationCustomer 或也为 Spring Boot default 配置 缩短命令行吗?

2023-03-15 14:54:33 1001 1

原创 利用vite创建vue3工程

官方创建的前端构建工具。

2023-01-03 14:25:38 465

原创 利用vue-cli创建vue3工程

需注意:想创建vue3工程,对vue-cli版本有要求,必须确保vue-cli在4.5.0以上。

2023-01-03 10:47:41 704

原创 el-calendar日历自定义显示内容

有码友在评论区里分享了更简介的方式,看到后一直想尝试一下,所以本篇就是来填坑的。

2022-08-16 15:40:31 2988 5

原创 vue使用原生video标签播放视频

如果想实现自动播放,需要加autoplay属性,但是加了之后也可能出现无法自动播放的问题,还需要在加muted属性

2022-07-22 16:35:14 3366

原创 java利用Freemaker模板引擎生成word并导出

制作好要导出的word模板,后台将数据写入文件中传给前端,前端保存对应的word文档即可。(我在网上搜相关教程时,看到有的帖子是先生成了word文档,将word文档以流的形式给前端,导出之后,再将生成的word文档删除掉,其实这相当于多次一举,所以你在看的时候注意甄别实现思路)...

2022-07-22 15:34:11 1124 7

原创 java二维数组转Map

此处的ArrayUtils引用自org.apache.commons.lang3.ArrayUtils;,确保你的项目中有相关依赖即可

2022-07-22 11:29:27 895

原创 利用Freemaker模板引擎制作包含表格和图片的word导出模板

注如果显示的数据在后台是封装到实体类中的,我们需要写成类似${user.name}这样的,也就是说后端怎么封装数据,前端就怎么拆解显示数据。我们在word文章中插入的一张图片,在转xml的过程中会被转为base64码,非常好找,就是一串很长很长很长……找到$符所在的位置,发现${}内容不是我们预期想要的,需要将中间多余的部分删除掉,整理成可以识别的格式。将需要动态输出的数据用${}来占位标记,图片就需要在word文档中真的插入一张图片。将其替换为我们要显示的图片的${}占位符即可。......

2022-07-20 11:49:02 759

原创 java读取远程图片时数据丢失而显示不全

java利用Freemaker模板引擎生成word导出,导出的数据中包含图片,所以需要先将图片转化为base64码,然后将这些数据输出生成word文件。之所以用InputStream.available()可能就是因为在InputStream和OutStream中用得太顺手了,就像直接套固定公式一样。我们知道读取远程文件需要依赖网络环境,这个过程通常是不可控和不稳定的,也就是说read()可能会阻塞,因此不能再采用。但是导出的word文件依旧出现了类似下图中显示不全的现象,很明显是。...

2022-07-18 14:40:30 880

原创 利用Freemaker导出word时的常用语法示例

Freemak导出word文档时的常用语法示例

2022-06-23 15:33:38 574

原创 js获取当前月、上一月和下一月

获得当前月/上一月/下一月

2022-06-23 11:20:26 13154

原创 npm查看是否安装了某个插件

没有安装的话就会显示empty,已经安装的话就会显示相应版本信息

2022-06-17 11:44:08 1559

原创 java将图片转化为base64码

Base64是网络上最常见的用于传输8Bit字节码的编码方式之一,Base64就是一种基于64个可打印字符来表示二进制数据的方法。将图片转化为base64码就是可以将一幅图片数据编码成一串字符串,使用该字符串代替图片地址,从而不需要使用图片的 URL 地址。示例中读取的是远程图片文件,如果要读取本地文件,请看链接:读取本地文件和远程文件https://blog.csdn.net/rear0312/article/details/125199724?spm=1001.2014.3001.5501...

2022-06-09 11:33:27 19236

原创 java读取本地文件和远程文件

java读取本地文件和远程文件

2022-06-09 11:20:00 9319

原创 java获得指定时间的前几天或后几天是哪一天

相关代码: public static Date daysAgoOrAfter(Date oneday,int amount){ Calendar mon = Calendar.getInstance(); mon.setTime(oneday); mon.add(Calendar.DATE,amount); return mon.getTime(); }注:前几天参数amount为负整数后几天参数amount为正整数测试: public ...

2022-04-27 17:37:09 3023

原创 Element plus设置日历每周第一天从周一开始

背景:其实之前我还没有发现这个问题,因为我使用date-picker或者calendar时就是一个日期的应用,每周从第几天开始,对于功能和用户都没有什么影响,但是我现在碰到一个问题是要统计某一周的数据需要用date-picker选择周次,默认是从周日开始的,这就和我们中国人的使用习惯是不相符的,因此不得不解决这个小问题,使每周第一天从周一开始。Element(适配VUE2)可以很简单的进行设置但是我在Element plus(适配VUE3)却没有发现类似的配置属性,很无奈,只能从API的只言

2022-04-27 12:12:08 6783 20

原创 echarts折线图实现渐变效果

先看下效果图是这个样子的 ,和普通的折线图最明显的区别就是需要做成渐变效果。目录1、官网找例子2、初步改造示例,有个雏形3、细节改造和优化4、全部代码5、原始效果和完成效果对比1、官网找例子样例地址:https://echarts.apache.org/examples/zh/editor.html?c=area-basic官网初始option复制到项目中,得到的效果如下图(width:424px;height:200px;):2、...

2022-01-10 14:01:08 13966 5

原创 echarts漏斗图自定义漏斗颜色、粗细、大小、间隔缝隙

目录1、官网找样例2、初步改造示例,有个雏形3、细节改造和优化4、全部代码5、原始效果和完成效果对比​碎碎念:UI效果图是这样的看到之后我一脸懵,按照常规阶梯思路,我又开始了度娘之旅。1、官网找样例样例官网地址把样例的option复制到本地,原始option代码:let demoOption = { title: { text: 'Funnel' }, tooltip: { trigge..

2022-01-07 15:21:01 8579

原创 echarts雷达图自定义射线颜色、边框效果和背景样式

从ECharts官网雷达图样例中一点一点实现效果图

2022-01-07 11:19:57 21304 4

原创 java获得当天的0点和最后时刻

/** * 获得当日0点 * * @since 2021-12-22 * */ public static Date getZero() throws ParseException { return new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").parse(DateFormatUtils.format(new Date(), "yyyy-MM-dd 00:00:00")); ...

2021-12-23 11:49:45 9109 2

原创 java判断当前时间是否在某一Date时间段内

/** * 判断当前时间是否在[startTime, endTime]区间,注意时间格式要一致 * * @param nowTime 当前时间 * @param startTime 开始时间 * @param endTime 结束时间 * @since 2021-12-22 * */ public static boolean isEffectiveDate(Date nowTime, Date startTi...

2021-12-23 11:33:11 829

原创 将本地代码第一次提交到gitee远程仓库

背景:公司代码用的是gitlab(不支持外网连接),平时的代码都是提交到gitlab远程仓库,但是我想自己保存一下代码,以达到公司代码和gitee远程代码一致,这样我通勤上班就不用来回背电脑了,回到家,只需要把代码拉下来继续敲就可以了,如果有大佬是这样做的,欢迎指点。1、查看当前远程仓库地址git remote -v2、替换远程仓库地址git remote set-url origin https://gitee.com/***/***.git3、将代码提交到远程仓库git

2021-09-06 17:55:58 264

原创 activiti7没有自动生成表

一波平了,一波又起解决了上一个题问题描述紧接着又出现了新的问题——activiti7没有自动生成相关的25张表首先检查配置项是没有问题的然后就问了度娘,发现一篇文章分析得特别好,有兴趣的小伙伴可以戳链接☞深入分析mysql 6.0.6 和 activiti 6.0.0自动创建表失败的问题解决方法回归到我的项目来,发现确实是“串库”了,如果把同库的activiti相关表删除掉,项目可以正常启动。如果不想删表,就在数据库连接url后面加上nullCatalogMeansCur..

2021-08-30 10:55:15 979 1

原创 The following method did not exist: ‘org.apache.ibatis.scripting.LanguageDriver org.apache.ibat

瞎想:在若依框架的基础上整合activiti这一过程就像升级打怪一样,遇到问题——解决了问题还会遇到新的问题,就这样吧,一步一步来,总会把activiti运用到得心应手的地步接着上个问题The bean ‘methodSecurityInterceptor‘, defined in class path resource []could not be registered解决完之后又出现了新的错误,请看:***************************APPLICATION FAILED

2021-08-27 17:50:29 3142 2

原创 The bean ‘methodSecurityInterceptor‘, defined in class path resource []could not be registered

项目背景若依框架springboot整合activiti7时出现报错问题描述***************************APPLICATION FAILED TO START***************************Description:The bean 'methodSecurityInterceptor', defined in class path resource [org/activiti/spring/boot/MethodSecurityCon

2021-08-27 17:28:34 2716

原创 npm install没有生成node_modules文件夹

问题出现背景从svn下载了代码,然后vscode打开项目。npm install控制台一直卡着,也不报错也没有进展,我当时还以为是在下载资源网速慢之类的原因,看了下项目里也没有生成node_modules文件夹,才意识到真出事了。开始百度各种解决方法,大致说的都是先清理缓存再npm install。我就按照方法试了,试了几次没有成功,最后发现不成功的一个原因是没有删除掉package-lock.json文件,所以正确有效的顺序应该如下:1、手动删除package-lock.json文件

2021-08-26 11:14:26 7250

原创 2021年6月PMP考试50天备考5A通过经历心得分享

这两天PMP的成绩陆续出来了,看到自己考试通过了,才敢写点东西,记录一下备考经历。▲考试证书及5A成绩目录为什么要报考?如何选择培训班?乐凯靠谱吗?整个费用是多少?我是怎样备考的?备考感悟考试经历考试有没有原题?PMP到底有没有用?考后感悟为什么要报考?对PMP早有耳闻,之后看到数字郑州(阿里巴巴(中国)网络科技有限公司与郑州大数据发展有限公司共同成立的合资公司)的15薪招聘岗位上提到了这个证书,有点受刺激,脑子一热就报了。如何选择培训班?

2021-08-13 19:23:27 992

GradientColor.js

生成渐变颜色

2024-04-01

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除