自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(99)
  • 资源 (5)
  • 问答 (3)
  • 收藏
  • 关注

原创 【格式转化】全角和半角

通用的字符是半角,全角可能导致一些异常失败。人工输入是不可靠的,因此需要对输入的内容进行格式化转换。

2024-03-21 15:49:23 177

原创 【Ant Design】【List】

将数据注入List组件时,再用String包一层,防止存在null。

2024-02-22 15:17:03 486

原创 【本地调试HTTPS】基于Mac Umi

https://blog.csdn.net/ZY_FlyWay/article/details/125616927https://www.wyr.me/post/618

2023-12-13 11:00:42 91

原创 【umi-reques】umi-request 配置request后,无法覆盖默认设置的 Content-Type:text/plain

要么让后端加上cors,要么前端通过代理方式访问,如果要改Content-Type, 就不能加mode: ‘no-cors’设置mode: ‘no-cors’ 再设置。

2023-12-07 16:28:48 549

原创 【G2】数据不能显示完整

多半是坐标轴的字太长,自动截断了。可以尝试将坐标轴的说明文字减少。

2022-09-20 14:44:30 470 1

原创 【Ant Modal Form 默认值】不能立刻更新

一开始直接用useState更新,发现总是延迟,一度甚至想用Promise转换成同步,未果。翻阅文档,发现官方给出了这样的解释。默认值需要用form.setFieldsValue直接更新

2022-04-25 14:34:34 647

原创 【启动项目时报错】<--- Last few GCs --->内存溢出<--- JS stacktrace --->

升级node版本!至少升级到15或以上的版本,确保你的node环境能够适配当前项目依赖升级node版本同时也能有效防止在安装依赖时出现各种奇怪的问题。且这个报错并不是mac m1芯片独有的,但是它确实更可能发生在m1芯片上。可能是因为底层对内层使用做了更为严格的限制。...

2022-04-18 20:33:43 3435

原创 【AntV G2】生成图表边缘贴边显示不全

因为使用canvas生成的图表,无法通过样式修改。官方提供了一个API nice: true

2022-04-13 11:48:19 504

原创 【Umi/Ant Design Pro】调试node_modules

umi 默认情况下会使用msfu,进行预编译,提高加载速度,但是这样会导致在node_modules做的修改,无法通过热更新获得实时的改动。如果使用Ant Design Pro框架,那么就需要在config.ts中把配置项mfsu: {}去掉。等待再次编译,即可看到node_modules中的变化...

2022-04-12 15:44:52 780

原创 【canvas 背景色】透明背景转换成白色

canvas 生成图片时,如果是canvasDom.toDataURL('image/jpeg')那么图片是黑色底的如果是canvasDom.toDataURL('image/png')那么图片是透明底的如果希望将图片的透明底色换成白底那么可以设置 const ctx = canvasDom.getContext('2d'); const imageData = ctx.getImageData(0, 0, canvasDom.width, canvasDom.height)

2022-03-30 20:25:39 7185

原创 [AntV G2] 图表横坐标显示不全

使用G2 生成图表时,因为横坐标内容过多,会导致显示不全。如果想显示完整的横坐标有两个方法。解决方案一: 增加倾角,使文字倾斜显示解决方案二: 使文字竖排显示文字倾斜显示 chart.axis('x', { label: { offset: 30, // 设置坐标轴文本 label 距离坐标轴线的距离 textStyle: { textAlign: 'center', // 文本对齐方向,可取值为: start mid

2022-03-30 16:58:16 4329

原创 [React Hook “useRequest“ is called conditionally] 报错解决

这是个ESlint报错你不理他,结果也可以正常运行。更多的是一种警告。Hooks 的调用应该是在顶层的。可能你的报错是其他的Hook,类似React Hook “useState” is called conditionally。原因都是一样的。官方文档的解释有可能在调用你的hook之前,你就执行了某些return 操作,导致这个报错。 if (!visible) { return null; } const { data: idData }: { data: string } =

2022-03-29 19:55:17 3198

原创 [Ant Design Pro] ProTable 的轻量级搜索异常

BUG描述: 在基于ant design pro的脚手架进行开发时,表格组件使用了ProTable,并采用 search={{ filterType: 'light', }}由于表格不是置顶(表格上方还有其他内容),在第一次点击搜索栏的第一个按钮时,发现整个页面滚动到首部。在第二次点击时正常,无自动滚动。排查过程:首先查阅官网API试图查询蛛丝马迹,但是一个相关API都没有怀疑是自己这个column有问题,但是发现只要在第一个位置的搜索项都会出现这个问题

2022-03-29 16:51:23 731 1

原创 【TS报错】refers to a value, but is being used as a type here

确认你的文件后缀是tsx而不是ts这个错误很是离谱,花了很长时间,结果是这里出错了。。。。https://stackoverflow.com/questions/62059408/reactjs-and-typescript-refers-to-a-value-but-is-being-used-as-a-type-here-ts

2022-03-22 19:43:33 5161 3

原创 ant table/ProTable 表头 自定义排序

Tablecolumn 参数中如果传入boolean 值类型,就是本地前端排序,可以排当前页如果传入function 就是自定义排序方式 / 服务端排序,此时需要配合Table 中onChange参数进行处理参考文章ProTableproTable 中默认在request中集成了对sort的监听,只需要在sort中对升序降序进行判断,处理自己的排序逻辑即可。...

2022-03-16 14:18:01 1498

原创 [报错] Property ‘componentsName‘ does not exist on type ‘JSX.IntrinsicElements‘.

在jsx 语法中组件需要遵守大驼峰命名法首字母需要大写

2022-03-15 14:27:35 783

原创 前端Docker 使用简介

配置Docker环境 windows 环境配置创建image(镜像)项目中一般会有两个docker脚本文件一个是给本地代码使用,一个给本地依赖的npm包使用。所以需要生成两次镜像,首先打包生成npm 包的imagedocker build -t npmDocker -f Dockerfile.npm . -t 后面是image的名称(自定义,但是要和脚本文件中保持一致)-f 选择指定的Docke脚本文件. 命令最后有个点,不能忽略docker build ..

2022-03-15 14:11:56 920

原创 [Ant Design Pro] Warning: validateDOMNesting(...): <form> cannot appear as a descendant of <form>.

错误信息:里面不能嵌套产生原因:ModalForm是带form的,ProTable的搜索框也是带form的,所以会报错。

2022-02-23 17:02:49 1501

原创 频繁操作导致的重复请求

两种解决思路在http请求时加入 loading 状态在请求时添加 节流 防抖

2021-11-12 10:03:40 82

原创 JS提取两个数组不同元素

let res = arr1.concat(arr2).filter((value, index, arr) => { return arr.indexOf(value) === arr.lastIndexOf(value); }); return res;

2021-11-05 14:56:37 333

原创 前端项目中忽略 console.log 语句

console.log 是项目开发时常用的调试语句,打包上线时,如果一个个处理非常麻烦。以下有俩种方案处理一. webpack 方式通过插件uglifyjs-webpack-plugin 自动去除npm i -D uglifyjs-webpack-pluginconst UglifyJsPlugin = require('uglifyjs-webpack-plugin')const config = { devServer: { proxy: {

2021-10-26 14:20:54 265

原创 [] 是 true, 但它不等于 true

1. !![] // -> true 2. [] == true // -> falsejs 中 有且只有nullundefined空字符串 即 “”数字 0数字 NaN会被当作false,其余都是真。[] == true进行隐式转换时,会调用object类型原始值,将其转换为 “” 即 false...

2021-10-25 16:19:57 243

转载 JavaScript强制类型转换 ([] == []、[] == ![]、{} == !{} )

语法规范ECMAScript 中的相等操作符由两个等于号 ( == ) 表示,如果两个操作数相等,则返回 true。相等操作符会先转换操作数(通常称为强制转型),然后比较它们的相等性。在转换不同的数据类型时,相等操作符遵循下列基本规则:如果有一个操作数是布尔值,则在比较相等性之前,将其转换为数值;如果一个操作数是字符串,另一个操作数是数值,在比较之前先将字符串转换为数值;如果一个操作数是对象,另一个操作数不是,则调用对象的 valueOf() 方法,用得到的基本类型值按照前面的规则进

2021-10-25 14:19:28 258

原创 透明度 opacity 继承问题

opacity 是会被子元素继承的属性,所以如果希望子元素正常显示的话,可以将父元素的opacity 更换为background的 rgba属性,其中a就代表透明度

2021-04-05 21:16:31 499

原创 <object>标签导致的元素遮挡问题

在接入第三方厂商的插件时,发现他们使用的是object标签生成的,导致页面渲染时的优先级贼高,且无法被z-index控制。也就是说如果有dialog之类的弹窗需要悬浮在最上层,会被object标签内容遮挡。解决方案引入iframe(没有成功实现,但是网上主流推荐方案是这个)利用元素显隐控制,Vue中可以用v-show控制弹窗打开时将其关闭的业务逻辑,React中可以设置一个变量去控制,原理相同...

2021-04-05 21:14:21 787

原创 [windows系统版本] 多语言

以前一直没注意windows的版本多语言是什么意思,直至下载了日语输入法后发现想要同时使用英语和日语(准确的说是在英语外添加其他语言)需要重装系统,安装多语言版本的系统。

2021-03-25 22:15:59 268

原创 Elment tree 组件右键功能菜单添加

采用原生提供的API-- node-contextmenu 实现右键功能 <el-tree :data="treeData" @node-click="handleNodeClick" @node-contextmenu="rightClick" node-key="id" :props="defaultProps" :default-expanded-keys="[1]" :defau

2021-03-18 15:12:55 728

原创 同一端口下运行多个项目的nginx极简配置

server { listen 9091; server_name test; root /usr/local/test; # 该路径为多个项目文件的父级目录 location /first/ { # 该路径匹配前端项目中publicPath的值 alias /usr/local/test/demo1/; index index.htm.

2021-03-18 10:46:04 438

原创 极简nginx前端配置

server{ listen 9091; server_name localhost; root file_route; index index.html index.htm ; location / { try_files $uri $uri/ @router; index index.html; } location @router { r.

2021-03-01 09:56:52 94

原创 Vue中监听页面滚动 ||无法获取页面位置

讨论最全最详细最有启发性

2021-01-28 16:12:30 271

原创 Vue 路由跳转空白

场景在新编写某个模块时,本地调试一切正常,打包部署后,线上跳转至该模块会出现白屏分析如果本地没问题,那么代码逻辑是没问题,就是打包这步出现了问题,极有可能是打包时无法读取路由引入的路径改变路径所以把代码从一开始的export default [ { path: "/test", name: "test", meta: { tabname: "测试" }, component:()=>import('@/views/XXXXX/XXXXX

2021-01-25 16:00:49 668

原创 构建报错Failed to create the worker pool with workerId/ Please verify if you hit the OS open files limit

完整报错信息 throw new Error(`Failed to create the worker pool with workerId: ${workerId} and ${''}configuration: ${JSON.stringify(options)}. Please verify if you hit the OS open files limit.`); ^Error: Failed to create the worker pool with workerId: 4

2020-12-15 09:44:49 443 1

原创 安装deb包失败

环境操作系统:麒麟(可以理解成ubuntu)注意是arm64架构描述使用dpkg - i xxx.deb 时提示安装失败,但是确认本身包没有问题解决是因为之前测试样例打过一次deb包,存在同名deb情况下,无法自动覆盖安装,必须使用dpkg -r xxx.deb将原来的包删除,才可以再次安装成功...

2020-12-09 00:15:31 4069

原创 JS校验空格

去除所有空格str.replace(/\s/g, '')去除两边空格str.replace(/^\s+|\s+$/g, '')

2020-11-23 16:17:08 503

原创 sockjs影响Vue项目的HMR(热更新)

因为在ie中控制台报错sockjs.js … net::ERR_CONNECTION_TIMED_OUT.然后看到这篇博文解释错误分析:sockjs-node是一个JavaScript库,提供跨浏览器JavaScript的API,创建了一个低延迟、全双工的浏览器和web服务器之间通信通道。在项目运行以后,network会一直调用这个接口。如果没有使用,那么就一直会报这个异常。解决办法:1)找到/node_modules/sockjs-client/dist/sockjs.js2)在1605

2020-11-17 16:08:40 520 2

转载 如何实现选中复制的功能

它一般可以使用第三方库 clipboard.js 来实现主要有两个要点选中: Selection API复制: document.execCommand转载于 https://q.shanyue.tech/fe/html/20.html#%E9%80%89%E4%B8%AD

2020-11-17 10:42:10 478

原创 表单校验自动定位到必填项

场景描述一般在长表单中,有些必填项很难发现,因此需要自动定位到相应位置,方便用户找到填写。解决思路先通过基础UI库校验必填项时的样式变化来选中相应的元素,再通过Input,textarea自带的focus方法,实现定位具体代码 let isError = document.getElementsByClassName('is-error') // 适用于element isError[0].querySelector('input').focus() // 只定位到第一个必填项

2020-11-09 09:43:20 2072

原创 Elment Form 非空校验(包含空字符串)

全内容不可输入空格使用自带的修饰符trim,对model内容进行修改<el-input v-model.trim="form.name"></el-input>通过焦点事件修改这种方式,影响回车提交,并且@blur的form.name不能直接写成value(原因未知,理论上可以,有空填坑)<el-input v-model="form.name" @blur="form.name=$event.target.value.trim()"></el-inp

2020-11-03 11:20:26 1251

转载 element ui 中message 重复弹出问题解决

需要重新写一下element-ui的message新建resetMessage.js/**重置message,防止重复点击重复弹出message弹框 */import { Message} from 'element-ui';let messageInstance = null;const resetMessage = (options) => { if(messageInstance) { messageInstance.close() }

2020-10-26 15:23:41 1924 2

原创 浏览器批量打印及样式兼容解决方法

去除页眉页脚的样式 @page { size: auto; /* auto is the initial value */ margin: 0mm; /* this affects the margin in the printer settings */ }具体方案参考Disabling browser print options (headers, footers, margins) from page?多文件批量打印<div style="pag.

2020-10-23 14:03:02 928

2016年下半年 系统架构设计师 案例分析.docx

2016年下半年 系统架构设计师 案例分析

2021-07-27

这是一个nginx 的配置

nginx 配置

2021-04-12

JS_game.rar

使用JS开发的小游戏,包括超级玛丽,俄罗斯方块,贪吃蛇三个小游戏

2020-10-26

685道JS面试题(含答案)

收录BAT面试笔试题,虽然年份较早,但有参考意义

2020-10-26

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

TA关注的人

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