- 博客(53)
- 收藏
- 关注
RSS订阅原创 react如何使用useContext + TS 自定义hooks
通过在 Context 和相关函数中添加类型定义，我们可以在 TypeScript 中获得更好的类型检查和智能提示。这些类型定义有助于捕获潜在的错误，并使代码更易于维护和理解。
2024-08-05 21:20:04
306
原创 服务器生成秘钥并使用
服务器怎样生成秘钥，xshell怎样使用秘钥连接服务器？下面以centos做演示（不仅仅只是cnetos适用，ubt也是可以用的的，但是命令需要稍微改一下）
2024-07-27 11:32:06
303
原创 允许服务器支持密码直接连接
服务器只允许秘钥而不允许输入密码连接，怎么修改运行使用密码连接？下面以centos做演示（不仅仅只是cnetos适用，ubt也是可以用的的，但是命令需要稍微改一下）
2024-07-27 11:02:57
316
原创 docker发布镜像到自己远程私有仓库
请自己查找别的资料，此篇文章只讲述镜像推送到远程。，现在你要将它推送到 Docker Hub 的。假设你已经构建了一个镜像。
2024-07-26 23:34:30
187
原创 前端部署后提示用户刷新页面
实现这个需求有很多方式，我这里推荐一个本人认为最佳的一个方案，无需循环调用接口，纯前端就可以实现，也非常欢迎大家评论这个方案的优劣。
2024-07-21 23:23:35
392
原创 前端TS习题
本次一共推出三篇文章，TS基础篇、TS高阶篇、TS习题篇，三篇文章均已发布。请定义一个变量 ，类型为 解释我们使用 关键字定义变量，并指定其类型为 定义一个接口 ，包含 （字符串类型） 和 （数字类型）两个属性。然后定义一个变量 ，并使用该接口。解释定义了接口 ，包含 和 两个属性。然后定义了一个变量 ，并使用 接口来确保其具有 和 属性。定义一个类 ，具有属性 （字符串类型） 和方法 （返回 ）。实例化一个对象 ，并调用其 方法。解释定义了一个类 ，包含一个构造
2024-07-20 08:57:08
636
原创 前端TS高阶篇
类型断言是 TypeScript 中一个强大且灵活的工具，允许开发者在需要时绕过类型检查。合理使用类型断言可以增强代码的灵活性和可操作性，但也需要注意合理性和安全性。理解并掌握类型断言的使用场景，可以让你在编写 TypeScript 代码时更加得心应手。三斜杠指令在 TypeScript 中主要用于文件之间声明依赖关系和引入类型声明。：声明文件间的依赖关系，指定某个文件路径。：引入类型声明文件，通常用于引入目录下的类型库。：禁用默认库文件的加载，适合完全控制标准库的情况。
2024-07-20 08:55:26
791
原创 前端TS语法基础篇
/ 根据初始赋值来推导出变量的类型，以后的str的类型就不能改了// str = 2；// 报错，原因：变量在定义的时候，类型已经确定下来了，不能修改// 类型为1，常量不能被修改，所以它的值就是它的类型// 类型为2// 类型为123// ts中，let和const的区别：let的类型由它定义的值的类型来确定，而const的类型就是它值的类型// interface 相当于自定义类型// 定义接口类型 ==> 给对象用的// 属性名: 值的类型// 必须是分号;obj = {
2024-07-20 08:53:16
551
原创 发布支持TS的npm包
美中不足的就是，这个包之前使用js写的，现在你想增加TS类型，提升用户使用体验，那么你现在可以做以下几个步骤。2.这里 xxx.d.ts 的文件定义很重要，一定义保持一致，如果你的包是分别暴露，那这里就用分别暴露，默认暴露就要用默认暴露。1.你只需要严格按照我上面的那几个步骤去做就OK，不需在你的npm去下载 ts 相关的包，你仅仅只需要新建一个 xxx.d.ts 文件即可，然后在你的。2.在package.json中添加类型定义文件的路径: 在你的。在这个文件中，你需要声明所有导出的类型和函数。
2024-07-18 23:15:01
531
原创 style-components使用手册
div><MyButton $primary $color="black">按钮</MyButton></div>
2024-07-17 20:16:35
1203
原创 css实现前端水印
插入：小编自己封装了一个大文件上传的工具函数，支持切片上传、错误重试、上传进度、暂停和继续等，目前已发布在npm官网，感兴趣的可以看看。多处水印的实现，实际上传就是创建了一张svg格式的图片，再将这张图片作为背景图来实现。水印的具体细节可以调节svg的相关属性来实现。下载命令：npm i enlarge-file-upload。
2024-07-16 20:21:02
468
原创 图片依赖父容器等比适配不变形
在开发的时候，常常会遇到要基于父容器进行图片展示，父容器的宽高是固定的，需要将图片放进去，还需要保证图片等比缩放，不变形。下面有一些自带的css属性可以很好的解决这个问题。插入：小编自己封装了一个大文件上传的工具函数，支持切片上传、错误重试、上传进度、暂停和继续等，目前已发布在npm官网，感兴趣的可以看看。下载命令：npm i enlarge-file-upload。
2024-07-16 20:17:53
205
原创 react-redux搭建及不同版本间的对比
它旨在提供更简便的 API，帮助开发者解决 Redux 应用中经常遇到的一些常见问题，如配置 store、添加中间件、编写 reducer 逻辑等。Redux Toolkit 引入了几个核心概念，如“切片（slices）”来简化 reducer 和 action creators 的编写，以及创建异步逻辑的“createAsyncThunk”等工具。这种方法在react-redux版本5及之前非常流行，随着react-redux版本6和7的发布，这种方法已经被淘汰了。
2024-06-15 21:44:22
399
原创 在 Node.js 中使用 MySQL 并实现事务以解决并发竞态条件问题
【代码】在 Node.js 中使用 MySQL 并实现事务以解决并发竞态条件问题。
2024-06-14 23:34:34
453
原创 react 使用 react-intl包 配置国际化
注意:这里无论是FormattedMessage中的id还是formatMessage中的id，都与html中的id无任何联系，不会引起冲突，这里的id仅用于做国际化的标识， 编译后id将不会存在，无需有任何担心。注意:本篇文章中，只针对了中英文两种语言的切换，但实际上是可以对于多种语言的切换，并不局限于某几种语言，多种语言需要定义多个json文件，这个在你熟读完整篇文章后可以去尝试多语言的切换。注意:这一情况是针对于国际化业务的，提供解决问题思路，与任何npm无关，可以被任何国际化场景借鉴或使用。
2024-05-19 11:55:34
1255
原创 js光标定位+回显
这里借助了sessionStorage来存储数据和取出数据，所以在代码上有些改动，如果需要使用，请按照自己的业务场景修改。监听光标变化，并获取变化后的位置。
2024-04-14 10:14:01
262
原创 前端获取设备唯一标识
在一些场景中，如游客模式下，用户无需登录或注册任何信息，便可以使用我们所创建的应用，但是我们希望加上限制，每台设备仅仅能在游客模式下对服务发送3条信息，那么我们就需要获取设备的唯一标识，存在数据库中，来判断用户在某台设备所发送的信息数量。在打印出来的event.candidate变量中，
2024-02-18 23:00:24
1046
1
原创 vue+react 项目全局loading 封装
element plus中的loading有自己的样式，一般不需要自定义样式，具体可以参考element plus官网。这里讲的是封装loading，封装完后可以直接使用，一般配合封装的ajax或axios等请求使用。这里需要配合样式一起使用，样式可以直接写到全局样式中（具体按照你的实际项目中来）
2024-01-20 19:08:29
81
原创 element plus form事件
该方法的 ruleFormRef 为表单的 ref，我们通过ref，可以用别的按钮来触发表单校验，无需通过表单自带的确定按钮校验。
2023-12-30 21:42:08
97
原创 js封装公共方法注释规范
在 JavaScript 中进行方法封装时，注释是良好文档和可读性的重要组成部分。在 JSDoc 中，有许多标签可用于对函数进行注释。这只是列举了一些常用的，其余没有一一列举。
2023-12-06 23:33:50
628
1
原创 点击按钮失焦，导致触发两次
场景：在业务中经常会遇到，我们给输入框绑定了失去焦点调用查询接口，然后也给按钮绑定了点击调用查询接口。这个时候会出现一个bug，那就是当输入框通过点击查询按钮失去焦点，那么就会导致查询接口调用两次，那如何避免这个问题？这里，我们将@click事件改为 mousedown 事件，并阻止默认事件，这样就可以避免两次调用 接口，并且能保证单独的失去焦点调用或点击调用不受影响。注意：这里是用vue3举例，js可以在 mousedown 事件中event.preventDefault()阻止默认事件发生。
2023-12-06 23:19:58
221
原创 vue3 全局路由守卫
这些导航守卫允许你在路由导航的不同阶段添加一些自定义的逻辑。中，你可以等待异步组件解析完成；中，你可以阻止或者修改导航；中，你可以执行一些导航后的操作。
2023-12-04 23:27:34
373
原创 js实现阻塞demo
下面将展示，如何实现js代码阻塞，该方法只建议在调试程序中使用，请勿在部署后使用，这会严重影响用户体验。异步阻塞，通过async和await实现同步。
2023-12-03 10:48:51
214
原创 node脚本——修改文件名
此处展示为，将指定文件夹下的所有文件拓展名为ts的文件，改为拓展名为txt的。如果有类似需要，如：修改文件名等等，可参照此代码进行修改。
2023-11-26 14:17:58
134
原创 js处理数组，使键值变成一个新的二维数组
需求：all=[{aa:'123',bb:'456',cc:'789',dd:'abc'},{aa:'b123',bb:'b456',cc:'b789',dd:'babc'},{aa:'c123',bb:'c456',cc:'c789',dd:'cabc'},{aa:'d123',bb:'d456',cc:'d789',dd:'dabc'}] 请将all这个数组使用js进行处理，取all数组的第0条数据中的key，放到一个数组header里面。
2023-11-20 23:31:58
204
转载 js判断用户是手机还是电脑登录
本文做了一些自己的修改，如果希望查看原文，请转：https://www.cnblogs.com/dalaowang/p/10315419.html。
2023-07-23 13:33:37
154
原创 js异步函数
情景：在事件开发中，我们会遇到非常多的异步函数，很多时候，我们需要在异步函数完成后才执行，这个时候大家可能会用到promise等一些操作，但是在有些时候，我们无法直接对这个异步函数进行修改，这个时候可能就有点难办。这里有个弊端，因为qwe()函数可能会在多个地方调用，这样便会造成多次执行，如果我们只希望在dd()函数内执行，便需要加一些标识。这里有个异步函数，在不直接对qwe函数进行修改的情况下，实现 '123' 打印在 '异步' 之后。函数的回调函数，我们可以在异步操作完成后执行传入的回调函数。
2023-07-17 16:56:04
18
原创 js高级——使用递归函数来等待目标元素
这里我们是等待动态渲染元素$('.layui-select-title')，然后使用requestAnimationFrame函数进行递归调用，这也是和传统递归调用最大的区别，传统递归调用大概率会失败（要么是检测不到元素变化，要么是堆栈溢出），使用了requestAnimationFrame函数便可以轻松实现我们的要求。的作用是告诉浏览器在下一次重绘之前执行指定的函数。情景：在开发中，有大量的元素是通过动态加载出来的，很多时候我们需要在他渲染出来之后才执行，最常用的方法就是。
2023-07-13 09:26:48
59
原创 flex实现二维布局
属性用于确定一个弹性项目在主轴上的起始尺寸，然后根据剩余可用空间和弹性项目的伸缩能力进行调整。很多人使用flex，都发现了一个问题，flex对二维布局似乎并不友好，在二维布局更多人选择griad,flex则更多的在一维布局中使用。不给div直接设置宽度，而是使用flex-basis设置基础宽度。这里我们改为多行三列布局，其实只需要修改widt中的宽度计算方式，即可修改为4,5,6...列布局。它定义了一个弹性项目在主轴方向上的初始大小。，则弹性项目将在主轴方向上具有指定的初始尺寸。，并且为弹性项目设置了。
2023-06-15 09:34:09
31
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人