自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 Antd的Tooltip如何在文字不超出时不显示

Antd的Tooltip默认是鼠标放在内容上就会自动显示,现在想只有文字溢出省略时才显示Tooltip,要怎么做呢?很常见的一种方式是判断文字溢出然后通过****属性去控制显隐,这里就需要声明一个标识状态去控制,如果有多个Tooltip那不是要声明多个状态?事件,在事件中判断内容宽≥内容滚动宽度就去掉鼠标事件。...

2022-08-18 09:53:15 2765 10

原创 如何正确使用husky做代码格式校验

安装husky时遇到了一些奇怪的问题,pre-commit的执行权限在git-commit后被去掉了,导致husky不生效

2022-06-30 12:30:26 726 2

原创 【前端监控】如何确保页面关闭后,数据上报请求不会取消

在做前端监控数据上报的时候,当页面关闭后,发出去的请求会被取消掉,如下图:

2022-06-24 17:48:05 770

原创 体验一下什么是协商缓存

有很多文章都有从理论上讨论什么是协商缓存的,这里就不多做讲解了。这篇文章主要是要从实操入手协商缓存,给读者一个更直观的体验,以深刻理解什么是协商缓存。首先用node建立一个简单的静态资源服务index.html页面放在static目录中,静态服务准备好后,使用启动。打开DevTools并访问http://localhost:3000/[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5rR91qoT-1655462094140)(https://raw.githubuserc

2022-06-17 18:39:04 366

原创 python状态模式的一次实践

前言要想写成可维护性高的代码,必须要懂的设计模式。在平时工作中我会经常使用策略模式去让代码更加简洁,对于状态模式一直只是知道,但从来没实践过,前段时间帮朋友做一个抢苗的爬虫程序,发现在这种需要下单的业务场景下特别适合状态模式发挥其作用。什么是状态模式状态模式(State)定义:当一个对象的内在状态改变时允许改变其行为,这个对象看起来像是改变了其类。状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况。把状态的判断逻辑转移到表示不同状态的一系列类中,可以把复杂的判断逻辑简化。类型:形

2021-12-18 11:52:24 567 4

翻译 HTML实用技巧

这是一篇翻译文章,原文地址https://markodenic.com/html-tips/loading=lazy 属性性能技巧。使用loading=lazy属性去延迟加载图片,当用户滚动到图片位置时再加载图片。<img src='image.jpg' loading='lazy' alt='Alternative Text'> 点击发邮件,打电话和发短信<a href="mailto:{email}?subject={subject}&body={con

2021-09-30 15:07:53 113

原创 TS2722: Cannot invoke an object which is possibly ‘undefined‘.

问题描述graphRef.current?.zoom(0.9)graphRef.current可能是undefind,用可选链调用zoom方法,结果ts报错TS2722: Cannot invoke an object which is possibly 'undefined'.,百度了半天也没找到答案,在此记录一下问题解决方法。解决方法graphRef.current?.zoom!(0.9)zoom方法后面加上!就行了...

2021-06-18 12:42:10 6011 4

原创 办公自动化-xlswings

基本概念import xlwings as xwxw.Appxw.Bookxw.Sheet以上是三个xlwings常用的类,xw.App()会打开一个excel应用,xw.Book()会创建一个工作薄,xw.Sheet会创建一个工作表。怎么用代码创建一个excel表格并保存?import xlwings as xw## 打开excel,创建一个工作薄,工作薄中创建一个sheet表app = xw.App()book = app.books.add()sht = book.shee

2021-04-08 23:42:11 610 2

原创 体验一下ipfs的上传下载速度

什么是ipfsipfs(星际文件系统),它是一种分布式存储协议,去中心化的,上传的文件会存储在固定的某个服务器,而是存放在各个分布式节点中,下载时也不是从单个节点下,而是从多个节点同时下载,最后拼接成一个完成文件,有快速、安全的特性。分布式存储会作为web3.0的重要基础设施。这篇文章阐述了分布式存储将成为未来的趋势。「重磅!」人民网:分布式存储打开千亿级市场到底能有多快呢?这里我录了一个视频体验了一下https://www.bilibili.com/video/BV15X4y1G7Hm客户端

2021-03-27 14:07:20 2028

转载 WebStorm转VSCode开发需要安装很多插件,这里记录下一些好用的插件

文章转载自:https://www.jianshu.com/p/dc2f1c7ace291、Auto Rename Tag修改html标签自动补全,改了首标签,尾部自动变。webstrom自带2、Code Runner自动检测packjson文件执行npm命令。webstrom自带3、样式Material Themewebstrom也有这样的插件,但是vscode丑好多4、eslint必须的5、GitLens — Git supercharged可以查看git所有提交记录,并且代码上面自动有提示

2021-02-27 14:47:48 1738

原创 position: sticky无效

position: sticky是黏性定位,可以实现和fixed定位一样的效果,但是它不会脱离文档流。坑使用的过程中发现是按照文档例子写的,position: sticky定位元素也使用了top属性。但是就是不生效,排查一通后发现是最顶层元素使用了overflow: hidden;,原来只要是祖先元素(注意是祖先元素)只要使用了overflow: hidden;就会导致position: sticky失效。那么MDN文档里关于position: sticky描述是不是有问题?我试了下hidden,

2021-02-26 01:34:53 1271

原创 flex布局第二行数据两侧对齐问题

问题描述使用flex布局时经常会遇到这种情况第二行只有两个数据,导致两侧对齐了。而我们预期的一般是这样子的如何解决?:after伪元素的妙用,在元素之后添加内容。.instance-card-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; padding: 10px 10px; background: #f2f2f2; // 这里使用伪元素 &::after {

2021-02-22 19:20:42 2779

原创 使用vue3做一个炫酷的流光文字组件

vue3已经发布一段时间了,还没接触vue3的同学可以看看这个小组件来尝尝鲜。灵感来源于这片博客:https://blog.csdn.net/luo1831251387/article/details/113838748?utm_medium=distribute.pc_category.none-task-blog-hot-4.nonecase&dist_request_id=88a58799-d745-4238-aba2-d720a30d8eb5&depth_1-utm_source=

2021-02-22 13:46:58 877

原创 css如何实现毛玻璃效果

在苹果的官网上看到看到一个悬浮菜单的毛玻璃效果被这种效果给吸引到了,深入源码后发现只通过两个css属性就能实现该效果。关键css属性background: rgba(29,29,31,0.72);加一个透明度为0.72的背景颜色backdrop-filter: saturate(180%) blur(20px);backdrop-filter给元素后方加过滤器,而不是元素,这里加了两个过滤器saturate和blur...

2021-02-17 14:06:26 13457 23

原创 如何配置在pipline中配置git submodule

配置在.gitlab-ci.yml中配置一个全局变量GIT_SUBMODULE_STRATEGY,告诉runner去下载git子模块。variables: GIT_SUBMODULE_STRATEGY: recursive出现问题运行pipeline报了类似错误fatal: could not read Username for 'https://gitlab.com': No such device or address,具体信息如下:Synchronizing submodule url

2021-01-21 19:27:00 1875

原创 DOMException: play() failed because the user didn‘t interact with the document first.

直接给video标签设置静音属性muted

2021-01-20 00:29:51 2667 2

原创 使用webpack搭建一个vue插件

前言作为一个现代前端,webpack多多少少都有接触过,但是我们平常都是直接使用脚手架工具搭建项目,自动集成了webpack,对于如何从0到1搭建一个webpack工程我们并不熟悉,那么我们今天就一起手把手来搭建一个基于webpack的vue插件,相信在这个过程中我们能够对webpack的使用有更深入理解。环境准备node版本 >= 10.13.0初始化项目创建项目目录mkdir vue-plugin-demo && cd vue-plugin-demo初始化成

2021-01-15 11:51:05 501

原创 xargs和sshpass一起使用的坑 xargs: docker: No such file or directory

背景远程删除docker容器问题使用的脚本如下:sshpass -p ${server_pwd} ssh -o StrictHostKeyChecking=no ${server_ssh} docker ps -a | grep my_project | awk '{ print $1 }' | xargs -r docker rm -fsshpass -p ${server_pwd} ssh -o StrictHostKeyChecking=no ${server_ssh}进行远程登录。

2021-01-13 20:30:07 1111

空空如也

空空如也

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

TA关注的人

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