weixin_43915401的博客

原创 文件分片上传，antd.Upload.customRequest

网上查了一下，发现一个很简单的方法，直接slice分割(O.O)，有种大开眼界的感觉。就写一个基础的文件分片上传 + antd.Upload.customRequest以供参考吧。前情提要：公司要求大文件分片上传，第一次听到的时候有点懵，文件要怎么分片？还是要说，不考虑代码优雅，反正能用就行。这里有写，就不多赘述了，直接用吧。

原创 jquery.ajax + antd.Upload.customRequest文件上传进度

前情提要：大文件分片上传，需要利用Upload的customRequest属性自定义上传方法。也就是无法通过给Upload的action属性赋值上传地址进行上传，所以Upload组件自带的上传进度条，也没法直接用了，需要在customRequest中加工一下。

原创 canvas.toDataURL后图片背景变成黑色

这个aphpa通道，就是RGBA中的A，JEPE通常只有3个通道（红色、绿色和蓝色），而PNG可以有4个通道（红色、绿色、蓝色和透明度）（当然也可以只有3个通道）。canvas转换成jpeg之前移除alpha通道，所以透明区域被填充成了黑色。的时候，有张白底证件照toDataURL之后变成了黑底，非常疑惑。查找一番之后发现貌似并没有特别好的解决方案，于是只能。

原创 找到/打开pupprteer对应chrome版本

前期提要：导出pdf的时候，会用pupprteer启动一个浏览器实例，再打开指定页面进行打印，页面写成什么样，导出的pdf内容就是什么样，听起来很正常。但是遇到了调试的时候页面显示很正常，而导出的内容css样式有问题的情况，经大佬指点，发现是我开发的时候，用的新版谷歌浏览器，而pupprteer对应的chrome版本比较旧，有些样式没兼容好。于是专门下载了pupprteer对应的Chromium进行调试，才解决问题。

原创 如何根据图片url获取到图片存储大小

中遇到的问题，如何根据图片url获取到图片存储大小。

原创 利用canvas压缩图片

在只有图片地址的情况下，将图片压缩后显示，一开始用的browser-image-compression插件，这是js压缩，是个异步函数，速度有点慢，于是大佬提出用canvas压缩，一番百度之后，抽出了一个基础版。试了下"image/jpg"和"image/png"，同一张图，原图尺寸的情况下，压缩文件变大了，如果使用缩略图尺寸，那倒是压缩了，毕竟图片是真变小了，但效果没有"image/jpeg"好。但是它自带的图片压缩功能，把4.93M的图片压成了33.8k，它都压那么好了我还能压什么。

原创 js img的onload事件不触发

上面的代码，可能存在设置addEventListener之前，图片已经加载完了，onload事件不处罚。调换一下img.src和img.addEventListener顺序试试。

原创 js set和数组转换

【代码】js set和数组转换。

原创 git 撤销push，删除远程仓库的提交记录

假设远程仓库的提交记录中存在（时间倒叙）commitAcommitBcommitC需要撤销commitA。

原创 js Object.keys获取到的key值顺序问题

【代码】js Object.keys获取到的key值顺序问题。

原创 限制浏览器网速

其他浏览器可能有其他网速选项，但是网路设置基本就是在Network选项下，位置应该也差不多。ps：一般建议给弹窗/按钮增加loading状态，防止重复点击之后多次请求。图中是谷歌浏览器，我看下Edge浏览器的控制台也差不多是这样。无限制，默认状态下的网速。，页面刷新会慢的明显一点。

原创 antd Tabs切换时销毁tab，每次切换都重新加载

这个属性，官方文档里没有，需要切换到英文，进入gitHub文档里才有。

原创 设置float后，按钮遇上position: relative点击失效

浮动元素所在浮动流在标准流之上，所以能看到button在div上方，这时候点击button依然有效。，div直接覆盖button，所以无法点击button。"表格内容"的div直接覆盖了button。样式后，div就不会覆盖button了。，清除浮动，button又显示出来了。给"表格内容"的div加上。antd.Button加上。div.table加上。div.table加上。没有浮动和定位的时候。

原创 浏览器查看，请在微信客户端打开链接

选择尺寸(dimension)，选择编辑(Edit)，选择添加自定义设备(Add custom device)这时候能看到UA已经替换成上面的一长串了，页面也不再提示"请在微信客户端打开链接"打开控制台，切换成手机模式（其实这个时候，UA已经换了，电脑伪装成了手机）保存，在尺寸(dimension)中选择刚添加的微信模式，刷新页面即可。图为谷歌浏览器，其他浏览器类似，总之就是要进入自定义模式。(页面空白是我用的链接问题，打开就是空白的。查找解决方案时，找到的答案。

原创 win11任务栏时间改成12时制

原创 moment获取指定日期的周x,某月最后一天

安装了moment插件的情况下，使用moment处理时间，原生的Date对象是另一回事。

原创 css calc复合运算

在less中，使用calc(100% - 7px)或者calc(100% - 7rem)的结果都是calc(93%)可以使用e(“calc(100% - 7px)”)或者e(“calc(100% - 7rem)”)实现理想中的运算。e函数用来直接返回传入的字符串内容，不包括引号，从而绕过less的解析换算。比如e(“calc((100% - 100px) / 2 + 10px)”)这个方案也可以用来算复合函数。

原创 二分模板2（进阶）

target是最大值时，r = nums.length - 1。所以，r的取值范围[-1, nums.length - 1];target是最大值时，r = nums.length。所以，r的取值范围[0, nums.length];target是最小值时，r = -1。target是最小值时，r = 0。

原创 css选择器

我觉得w3school里总结的很好，自己总结有点累赘。

原创 git 删除本地/远程分支

如果本地分支A下有未合并的更改或未推送的提交，会提示无法删除，一般来讲这种就是处理一下的，把修改的内容提交一下。一般来说，删除远程仓库的分支，可以直接在管理页面上进行操作，还更直观。注意：需要切换到其他分支下才能删除，处于分支A的时候，无法删除分支A。，在本地终端操作，是不是更高端一点。，换大写D，强制删除本地分支A。如果一定要删除的话，

原创 css white-space遇到“\n“换行

也能识别出换行符，但同时会保留空白符序列，如果只想换行，不建议使用。这样的文案，在页面里折行显示，就用换行符。设想是美好的，但是效果却是。一顿百度猛如虎，找到了解决方案。

原创 css input禁止光标进入focus

之后无法进行任何交互了，当然也不能添加事件（加了也没反应），纯粹展示，类似于disabled状态。不知道啥原因，用了input做展示，禁止编辑，禁止点击之后出现光标，遂扒拉出。

原创 css 改变下划线长度，伪元素模拟border-bottom

要实现文字下方下划线。

原创 js NaN不等于NaN

NaN代表非数字值的特殊值。该属性用于指示某个值不是数字。这个非数字可以是不同的数字,因此 NaN 不等于 NaN。

原创 css input改变placeholder颜色样式

没用过，遇到的项目，用户都是用新版浏览器的。

原创 css :first-child 和 :first-of-type

元素的背景设为黄色 + 第一个子元素的背景设为黄色 = 父元素的第一个子元素是。类型元素的背景设为黄色 = 父元素的子元素中，第一个。元素背景设为黄色，不一定要是第一个子元素噢。元素的背景设为黄色 + 第一个。时，该子元素背景设为黄色。

原创 js 比较两个时间是否相等，比较时间

【代码】js 比较两个时间是否相等，比较时间。

原创 js数组里使用三目判断，结合扩展运算符

{ a: 1} ] 和 [ { a: 1 }, { b: 2 } ][1, 2, 3, 4] 和 [1, 2, 3, 5, 6]如果arr有两种情况。

原创 js 转成Number , Boolean类型

【代码】js 转成Number , Boolean类型。

原创 js 对象循环遍历

可以使用break， continue，和正常for 循环一样。

原创 CSDN上代码块背景颜色的设置

原来是背景是黑色的，看不清注释，想改成浅色的。

原创 git 将当前修改的内容提交到新的分支上

习惯先在原有代码上做修改，改完再创建新的远程分支提交所以就牵扯到在已有修改的时候，如何将当前修改提交到新的分支上。

原创 js 对象数组排序 sort

回调用每个数组项的toString()转型方法，然后比较得到的字符串，所以100在14前面。如果第一个参数应该位于第二个参数的前面，则返回一个负数，如果第一个参数应位于第二个参数的之后，则返回一个正数。默认从小到大排序，改变原数组。如果两个参数相等，则返回0，该比较函数接收两个参数，

原创 git 根据tag/branch建立本地分支

【代码】git 根据tag/branch建立本地分支。

原创 js 取整，保留2位小数

当参数 radix 的值为 0，或没有设置该参数时，parseInt() 会根据 string 来判断数字的基数。如果 string 以 “0x” 开头，parseInt() 会把 string 的其余部分解析为十六进制的整数。：匹配 pattern 但不获取匹配结果，也就是说这是一个非获取匹配，不进行存储供以后使用。：最少匹配 n 次且最多匹配 m 次，在逗号和两个数之间不能有空格。把数字转换为字符串，结果的小数点后有指定位数的数字，四舍五入。：最少匹配 n 次最多匹配 m 次个数字字符。

原创 js 二分模板

思路来源：https://leetcode.cn/problems/search-insert-position/solution/hua-jie-suan-fa-35-sou-suo-cha-ru-wei-zhi-by-guanp/第二种情况，r = m - 1，target < nums[m]，插入m的位置，也是l，（不管最后剩1个数，还是2个数，m都等于l）毕竟r被减了1，不合适了。给定一个排序数组和一个目标值，在数组中找到目标值，并返回其索引。

原创 js字符串截取，substring

str.substring(from, to) 返回的子串包括 开始 处的字符，但不包括 结束 处的字符。

原创 ThinkPad笔记本电脑如何设置Fn热键切换功能

联想官方地址

原创 请求无返回，检查是否设置proxy转发

公司项目使用了umi，在请求没有任何返回的时候，可以搜索proxy，查看请求对应的请求头，是否设置了转发。

原创 删除node_modules文件夹

要在node_modules文件夹所在目录执行。node_modules文件包出问题了。window环境下的删除命令。或者删了文件包，重新。