- 博客(47)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 VsCode和AI的前端使用体验：分别使用了Copilot、通义灵码、iflyCode和Trae
本文介绍了四款AI编程助手插件：GitHub Copilot、通义灵码、iFlyCode和Trae。GitHub Copilot是老牌代码补全工具，深度集成于VSCode，支持多语言和复杂项目开发。通义灵码是阿里推出的免费编程助手，优势在于中文支持和教育场景，提供代码解释和优化建议。iFlyCode基于讯飞星火大模型，涵盖软件研发全流程，提供多种智能助理功能。Trae是字节跳动推出的AI集成开发环境，支持多模态和中文界面，提供AI驱动的开发体验。四款插件各有特点，开发者可根据需求选择适合的工具。
2025-05-16 16:19:00
1210
原创 vscode中一款从页面自动定位到代码为止的插件Code Inspector
当面对代码层级复杂、定位困难的情况时，可以使用一款便捷的插件。通过按下Shift+Alt并点击页面元素，插件能够自动打开对应的代码文件，极大提升开发效率。安装插件后，在F12打开的控制台中即可使用。这款插件操作简单，功能强大，只有亲身体验才能真正感受到它的实用性和便利性。
2025-05-16 15:05:08
200
原创 前端小技巧：一行代码让网页变成可编辑状态
Firefox 遵循这一标准。早期版本的 Chrome 和 IE 默认为。从 Chrome 43 开始，默认为。控制整个文档是否可编辑。在 IE6-10 中，该值为大写。根据规范，该属性默认为。就可以自由编辑页面拉~
2025-04-29 15:40:22
113
原创 富文本展示前使用DOMPurify进行文本过滤
DOMPurify时一款专门用于防御XSS攻击的库，通过净化HTML的内容，移除恶意脚本，同时保留安全的。
2025-04-27 16:51:43
168
原创 el-switch组件回显时自动触发change事件问题解决
2、在switch上添加 :active-value="1" :inactive-value="0"。1、回显时，将status字段从0、1变成true、false。
2025-03-06 14:27:13
364
原创 下拉框回显数据的时候，展示值，而不是label。
很大可能，列表的值是number，返回的是string。先对比一下回显的值和下拉列表的值，类型是不是一样。遇到这种情况，不要急。
2024-11-21 17:31:24
261
原创 git提交代码时提示husky - pre-commit hook exited with code 1 (error)
git提交代码时提示husky - pre-commit hook exited with code 1 (error)
2024-11-19 11:19:44
204
原创 typescript枚举值＜＜写法
这些枚举值可以用于表示不同级别的权限，例如，如果一个权限值为。，用于表示不同的权限级别。这段代码定义了一个TypeScript枚举类型。，则表示该用户拥有读取和管理工作的权限。
2024-09-30 09:37:13
387
原创 antd5.20版本flex组件支持换行布局时，使用＜Flex wrap＞实际并不生效
改成<Flex wrap="wrap"></Flex>就好了。
2024-08-13 15:28:45
307
原创 实时通信websocket和sse
是一个JavaScript库，用于处理服务器发送的事件（Server-Sent Events，简称SSE）。它提供了一个简单易用的API，使得客户端可以与服务器进行实时通信。这个库主要用于浏览器环境。安装依赖npm install @microsoft/fetch-event-source。
2024-06-13 17:20:22
586
原创 umijs+react+ts项目代码一片红处处报错解决
1、在没有 "node" 模块解析策略的情况下，无法指定选项 "-resolveJsonModule"。2、类型“JSX.IntrinsicElements”上不存在属性“div”。试了很多都没用，最后是参考这位朋友的解决了。
2024-05-31 16:17:32
581
1
原创 vue3中引用组件提示has no default export问题解决
手动下载volar的vsix文件，修改文件中对vscode的支持版本（当前安装的vscode版本）是vscode安装的vetur不支持ts写法导致的，换成vscode最新支持的volar就行。然后利用这样那样的方式把vsix文件导入vscode。经排查，该错误提示的真正原因并不是组件没有默认导出，因为这种实现方式无需导出。已知该问题提示的中文解释是指向：组件没有默认导出。
2024-04-30 17:49:20
8729
原创 react中useMemo 钩子函数的使用
是 React 中的一个优化性能的钩子函数，它接收一个函数作为参数，并返回该函数的计算结果。在第一次渲染时，它会执行传入的函数并将结果存储起来；在后续的渲染中，如果依赖项没有发生变化，则直接使用之前存储的结果，避免了不必要的重新计算。发生变化时重新执行，从而保证 chartData的值始终是正确的.这段代码的作用是在 React 组件中使用。接收了一个箭头函数作为参数，该函数会遍历。是一个数组，所以这个函数会在每次。
2024-04-12 16:07:26
434
原创 js绘制svg图时使用图片作为其中元素，图片的尺寸处理
表示将图片的中心点与SVG图的中心点对齐，并保持宽高比。如果图片宽度大于高度，则图片会被拉伸；如果图片高度大于宽度，则图片会被压缩。属性用于指定图片在SVG图中如何保持宽高比。
2024-04-10 17:42:17
548
原创 vue3+echarts绘制折线图鼠标悬浮时不显示tooltips问题
经排查，设置trigger: 'item'时，可以正常显示，只有trigger: 'axis',异常。echart实例不能赋值给ref响应式proxy对象，会导致tooltip不显示。是因为创建实例的时候，使用了ref(null)改成shallowRef就好了。
2024-04-01 17:10:52
842
1
原创 yarn安装依赖时报错certificate has expired at TLSSocket.onConnectSecure
安装依赖报错证书过期的解决办法
2024-02-04 16:38:59
11175
原创 wangeditor富文本编辑器限制输入文字长度和传到后台字符长度
使用正则表达式将标签替换成空字符串，然后计算输入文字的长度。上述代码不全，仅展示部分。
2023-08-31 10:07:24
4096
1
原创 vsCode更换主题和字体，如何改成和mac电脑类似的字体
更改主题，直接在扩展中下载相关的主题插件即可。字体的安装复杂点，首先修改字体的入口是。/设置/搜索font family。然后就是几款好看的字体。
2023-06-26 11:09:41
4153
原创 使用nvm管理node版本
卸载node有一个非常简单的方法，就是用电脑自带的软件卸载功能，/开始/设置/应用/卸载。正常情况下，node和npm是捆绑下载的，对应的npm版本应该没问题。3、nvm list avaliable查看可以下载的node版本。注意：在下载nvm之前需要先卸载掉电脑上已经安装的node。4、nvm install 12.0.0安装指定版本。6、nvm use 12.0.0切换node版本。5、nvm ls查看已经安装的node版本。方法：进入官网下载nvm。2、nvm -v查看版本。
2023-06-26 10:58:57
7521
1
原创 react + antDesign新手进阶学习指南
在react中使用变量有两种方式，一种是利用store中的变量，动态改变数据，一种是利用useState。和vue中的状态管理有些相似,只不过react中是依托于mobx的。2、react中的变量声明方式。1、react中的状态管理。
2023-06-26 10:46:02
565
原创 trim去除字符串左右两侧的空格
去除字符串左右两侧的空格trim原理----去除左空格s.replace(/(^\s*)/g, '')-----去除右空格s.replace(/(\s*$)/g, '')------去两边s.replace(/(^\s*)|(\s*$)/g, '')
2020-12-10 11:26:04
746
原创 前端实现：滚动条样式修改
谷歌展示如图代码：/*滚动条整体部分,必须要设置*/::-webkit-scrollbar{ width: 8px; height: 8px; background-color: transparent;}/*滚动条的轨道*/::-webkit-scrollbar-track{ background-color: transparent;}/*滚动条的滑块按钮*/::-webkit-scrollbar-thumb{ border-radius: 10px;
2020-06-05 17:44:19
2151
1
原创 vue实现动态查询，查询字段以及类型由后端返回，展示的表格字段也由后端控制
需求： 因为需求变更快，需要经常增加查询字段，更改较为麻烦，因此需要做一个通用的动态查询组件，每次变更不由前端控制，而是修改配置文件即可。一、动态查询解决思路： 定好前端需要的几种查询类型，返回格式，以及默认数据等等，利用前端的基础24 分栏布局开发一个通用的组件。实现效果如图：除了查询按钮外，其余数据，包括查询条件的位置全由后端控制。功能拓展：该组件同样可以用于其他地方，比如动态展示详情页面，由后端返回详情页面需要展示的key、val...
2020-06-05 17:39:57
2648
3
原创 rgb格式颜色与#000000十六进制格式颜色的转换原理
首先，#000000格式的颜色被称为十六进制颜色码；6位数分为三组，每两位数一组，依次是红、黄、蓝颜色的强度；而与此对应的，rgb（39，137，202)依次是十进制的红黄蓝颜色；因此将rgb格式转换成十六进制，只需要将三个数值转换成十六进制即可；39转换成二进制是27，137——89202——CA因此rgb（39，137，202)——#2789CA有一个简单直接转换的网址：https://tool.css-js.com/rgba.html输入数值就可以直接得到.
2020-06-05 17:07:57
5579
原创 在angular项目中实现类似tab小窗口一样的打开页，保留打开过的页面，再次点击回去保留离开时的状态
使用场景打开任意一个菜单页面的时候，出现对应页面的页签。切换页签，原来的页面信息状态保留，关闭页签则保留的信息删除。使用路由复用策略，保存路由快照。 实现效果如图所示实现过程概述:若使用vue开发，有现成的组件tagsViews；但angular中没找到好用的组件。1、在app.module.ts注册 providers: [ { provide: RouteReuseStrategy, useClass: CustomReuseStrategy } ],
2020-06-05 17:06:17
839
原创 vue项目实现文件下载
一、如果下载接口不需要token，可使用a标签，直接下载。二、如图所示，最后解决 1 getDownload(urls, fileName) { 2 var url = urls; 3 var xhr = new XMLHttpRequest(); 4 xhr.open("get", url, true); 5 xhr.setRequestHeader("Content-type", "a
2020-06-05 17:02:01
639
原创 从别的地方克隆了代码后，需要提交到自己创建的github项目中，报错git fatal: 远程 origin 已经存在
报错：git fatal: 远程 origin 已经存在。从别的地方克隆了代码后，需要提交到自己创建的git中。提示上面信息。或者第一次将地址配错了，需要修改远程地址。需要将远程地址删掉。git remote rm origin然后执行正常的提交程序git remote add origin xxxx.gitgit add.git commit -m 'xxx'git push --set-upstream origin master...
2020-06-05 16:59:40
427
react项目中实现生成corn表达式功能，毫无技术含量基础版本
2024-07-12
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人