自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 Node.js + Vue3 + TypeScript + Element Plus 实现Excel文件上传及接口实现

在现代Web应用中,文件上传是一个常见的功能需求,特别是Excel文件的上传和处理。本文将详细介绍如何使用Node.js作为后端,Vue3 + TypeScript + Element Plus作为前端,实现一个完整的Excel文件上传功能,方便以后遇到类似的直接拿来使用,避免再重复造轮子。

2025-07-23 18:28:43 986

原创 vue3+Ts 项目打包报错问题 记录

【代码】vue3+Ts 项目打包报错问题 记录。

2024-09-09 11:24:17 652 6

原创 uniapp:聊天消息列表(好友列表+私人单聊)支持App、H5、小程序

这是一款通用消息列表和聊天模板插件简单易用,助您轻松创建和管理消息与聊天内容。无论是与朋友互动还是团队沟通,都能满足您需求。立即尝试,畅享交流乐趣!

2024-04-07 10:15:45 15629 165

原创 第八篇:node模版引擎Handlebars及他的高级用法(动态参数)

模版引擎可以简单的理解为升级版的 html 文档,express可以用模版引擎来渲染前端页面,模版引擎有很多种,包括jade,ejs,nunjunks,Handlebars等等,express对每一种都提供了很好的支持,只需要几行代码就可以使用。我们今天来学习下Handlebars(简写hbs)

2024-02-02 10:04:07 2275 191

原创 《家的温暖,国庆团圆》

✅ 中秋节✅ 国庆节✅ 对未来的规划当然写了这么多,经过精心规划和准备,国庆假期的活动安排满满的,也希望这次回去都能圆满完成。开朗的豌豆,再见!

2023-09-28 13:41:17 2628 234

原创 从Vue 2到Vue 3:深入了解路由配置的变化与升级建议

欢迎阅读本篇文章,我们将带您深入探索Vue 2和Vue 3的路由配置。在现代前端开发中,路由是构建交互式Web应用程序不可或缺的一部分。Vue.js作为一种流行的JavaScript框架,在版本2和版本3之间进行了重大改进和升级。在这篇文章中,我们将比较Vue 2和Vue 3的路由配置,并介绍它们之间的主要区别和新特性。我们将探讨Vue Router的使用方法,包括路由的定义、嵌套路由的设置、路由守卫的应用等。我们还将深入研究Vue 3中的新特性,例如如何影响路由配置的方式。

2023-07-28 18:36:49 10001 207

原创 分享18个用于处理 null、NaN 和undefined 的 JS 代码片段

Null、NaN 和 undefined是程序员在使用JavaScript时遇到的常见值。有效处理这些值对于确保代码的稳定性和可靠性至关重要。因此,在今天这篇文章中,我们将探讨 18 个JavaScript代码片段,它们为处理null、NaN和未定义场景提供了便捷的解决方案。这些代码片段将帮助你通过有效处理这些值来编写更清晰、更优雅的代码。

2023-07-24 09:32:17 5963 200

原创 使用echarts+echarts-gl绘制3d地图,实现地图轮播效果

记录一下大屏开发中使用到的echarts-gl大屏的页面根据需求前前后后改了几个版本了,地图的样式也改了又改这里记录一下,因为echarts属性用到的比较多也比较杂,防止以后需要用到忘记了。

2023-07-11 17:51:57 14677 19

原创 uniapp逆地理编码

saca

2022-06-29 13:56:42 1010 5

原创 原生js H5适配它来了 保姆级教学

原生js H5适配它来了 保姆级教学

2022-04-29 10:11:01 882 3

原创 jquery 展开收缩改变状态 保姆式教学代码,默认第二项展开

jquery 展开收缩改变状态 保姆式教学代码,默认第二项展开

2022-04-29 09:41:04 632 5

原创 uniapp请求方法封装

uiapp请求方法封装// 请求接口const commoneUrl = "http://xxxxxxxxxx.com/";// new 域名//get请求封装function getRequest(url, data) { var promise = new Promise((resolve, reject) => { var postData = data; uni.request({ url: commoneUrl + url, data: postData

2022-04-21 00:00:00 769 3

原创 ​​​​1.微信商品详情分享

​​​​微信分享好友,朋友圈

2022-04-20 19:00:00 586 1

原创 原生瀑布流布局

下载插件http://tk.shangpreechina.com/themes/Ewdade/default/js/modernizr.js <!-- 瀑布流 --> <ul class="puBu" id="grid"> <if condition="$res_r"> <volist name="res_r" id="vo" mod="2" key="k"> <li class="puB..

2022-04-20 16:19:42 526 3

原创 可视化部署 Nginx:cpolar 内网穿透服务助力 Portainer 发布公网站点

在现代 Web 开发流程中,快速部署和远程测试是提升效率的关键环节。然而,对于缺乏服务器管理经验的开发者而言,搭建一个可公网访问的 Nginx 服务往往面临诸多挑战:Docker 命令行操作复杂、网络配置容易出错、公网 IP 获取困难等。这些问题不仅延长了开发周期,还可能因配置不当导致服务不稳定或安全漏洞。Portainer作为 Docker 生态中的可视化管理工具,通过直观的 Web 界面简化了容器生命周期管理。用户可以轻松创建、启动、停止和删除容器,监控资源使用情况,而无需记忆复杂的命令。

2025-08-15 10:22:00 601 8

原创 React 数据传递指南:6 种方式让组件“无话不谈”

在 React 开发中,组件之间的数据传递就像现实中的聊天——父子组件可以直接对话,兄弟组件需要‘中介’,而跨层级组件可能得靠‘广播’。今天,我就结合 6 年实战经验,带大家解锁 React 组件通信的 6 种姿势,让你彻底告别‘数据孤岛’!

2025-08-14 10:19:44 1180

原创 React 开发小技巧:父组件如何‘操控’子组件的函数?

在 React 开发中,我们常常遇到父组件需要‘指挥’子组件执行某些操作的场景。比如,点击父组件的按钮,触发子组件的某个动画或数据刷新。今天,我就来分享几种在 Hooks 环境下,父组件如何优雅地调用子组件方法的实战技巧!”

2025-08-14 09:55:03 398

原创 React Hooks 真香定律:告别Class组件,我为什么回不去了?

在Hooks里找到救赎的前端老司机。自从2018年Hooks横空出世,我的代码量直接砍半,今天就用最接地气的方式,带你们感受Hooks的魔法!

2025-08-13 08:52:22 553

原创 React Component和Purecomponent区别

React里老生常谈但很多人其实没彻底搞明白的问题——Component和PureComponent的区别。别看它基础,用对了能直接提升组件性能,用错了可能莫名其妙踩坑。下面我就用最人话的方式,带大家彻底搞懂它!

2025-08-13 08:46:57 730

原创 React Hooks花式玩法

记得我刚接触Hooks那会儿,看着useEffect的依赖数组差点把头发薅秃。现在回头看看,其实Hooks用好了真香!接下来我就用最直白的方式,带大家解锁这些神奇的函数。

2025-08-13 08:34:12 485 1

原创 React性能优化神器useMemo!这样用才不浪费,新手必看指南

今天要跟大家聊聊useMemo这个性能优化利器——用好了能让你的应用飞起来,用错了反而会让代码更难维护!

2025-08-12 08:51:49 550 1

原创 React父组件props变了,子组件如何立刻知道?3种监听方案实测!

今天要解决一个经典问题:当父组件的props更新时,子组件如何及时响应? 这个问题我面试新人时经常问,实际开发中也踩过不少坑。

2025-08-12 08:48:40 313

原创 useState vs setState:React状态管理,你站哪一队?

今天咱们来聊聊React里两个最常用的状态管理方式——setState和useState。虽然它们干的事儿差不多,但用起来可是有讲究的!

2025-08-12 08:38:45 709

原创 宝塔FTP的进阶应用——通过cpolar内网穿透实现远程文件协同管理

在服务器运维和开发协作中,文件传输的安全与效率始终是核心关注点之一。宝塔FTP作为宝塔面板内置功能模块,提供了直观的账号管理系统与细粒度权限控制能力,支持开发者快速创建多级用户体系并限定访问路径——这种设计既保障了数据隔离性,又为团队成员分配差异化操作权限提供了技术基础。当需要实现跨网络环境的文件协作时,cpolar内网穿透工具的价值得以充分体现。通过映射FTP服务至公网端口,使用者无需修改原有服务器配置即可安全访问私有云资源——设计师可远程更新网站素材库,运维人员也能在出差途中快速部署补丁包。

2025-08-11 19:07:42 1042 8

原创 告别Class组件!用useEffect玩转React生命周期

今天想聊聊如何用useEffect这个"瑞士军刀"来模拟Class组件的生命周期方法。还记得我刚学React时,生命周期方法是必背口诀:"willMount、didMount、willUpdate..."现在有了Hooks,一切都变得更简单了!

2025-08-11 08:57:41 832 1

原创 React状态管理:从Context到Redux,我的选型心得

今天想和大家聊聊React状态管理这个永恒的话题——特别是Context API和Redux这对"欢喜冤家"。

2025-08-11 08:52:16 893

原创 React表单控制秘籍:受控组件这样玩就对了!

今天咱们来聊聊React中一个看似简单却容易踩坑的知识点——受控组件。相信不少新手朋友在写表单时都遇到过"为啥我的输入框不听使唤"的问题,看完这篇你就全明白了!

2025-08-09 18:04:17 593

原创 Redux三剑客:揭秘reducer这个‘状态改造师‘的魔法

今天咱们来聊聊Redux这个状态管理界的"老大哥",特别是它那个看似神秘实则简单的核心部件——reducer。相信看完这篇,你会对Redux有全新的认识!

2025-08-08 08:24:51 1133 2

原创 setState vs replaceState:React状态更新的‘温柔一刀‘与‘彻底翻脸‘

今天咱们来聊聊React中两个看似相似实则大不同的状态更新方法——setState和replaceState。很多React新手在使用时常常分不清它们的区别,甚至不知道replaceState的存在。别担心,看完这篇你就彻底明白了!

2025-08-08 08:17:22 535

原创 高阶组件 vs 高阶函数:React 开发者的必备武器库!

今天要聊一个听起来高级但其实很接地气的概念——高阶组件(HOC)和高阶函数(HOF)。

2025-08-07 08:52:49 1233

原创 React性能优化:你的应用真的够快吗?

今天咱们聊聊React性能优化——这个话题看似简单,但很多项目其实都藏着不少性能隐患。

2025-08-07 08:49:19 692

原创 React事件绑定:箭头函数和bind,我该pick谁?

今天要和大家聊聊React中一个看似简单却容易踩坑的话题——事件绑定。不知道你们有没有遇到过这种情况:写了个点击事件,结果一点按钮就报错this is undefined。我刚学React时就被这个问题折磨得够呛,今天就来好好讲讲怎么解决。

2025-08-07 08:43:02 636

原创 React的onClick:你以为懂了,其实可能用错了!

今天咱们来聊聊React里那个天天用却可能被忽略的细节——onClick事件绑定。别看它简单,里面的门道可不少,不信?往下看!

2025-08-06 09:03:54 1056

原创 Element UI表格组件的秘密武器:key属性的妙用与全属性解析

今天想和大家聊聊Element UI中那个既常用又容易被忽视的table组件,特别是它那些不为人知的小秘密。

2025-08-06 08:56:38 545

原创 Vue.js vs 原生开发:为什么我用了Vue就回不去了?

记得刚入行那会儿,我还是个用jQuery一把梭的愣头青,直到遇见了Vue.js,才发现原来前端开发可以这么爽!今天就跟大家聊聊,为什么现在越来越多的项目选择Vue而不是原生开发。

2025-08-06 08:12:26 707

原创 5招轻松搞定Element-UI样式定制,让你的项目与众不同!

今天要和大家分享的是如何优雅地定制Element-UI组件的样式。相信很多小伙伴在使用Element-UI时都遇到过这样的困扰:官方默认样式很美观,但总感觉少了点个性,想要调整却又不知道从何下手。别担心,下面我就把多年积累的几种实用方法分享给大家,保证让你的项目焕然一新!

2025-08-05 08:00:57 841

原创 Vue做SEO太难?6年老司机带你轻松搞定!

,Vue这类SPA(单页应用)对SEO不太友好,因为内容大多是JS动态渲染的,搜索引擎爬虫可能看不懂。但别慌!今天我就分享几个实战中验证有效的SEO优化方案,让你的Vue项目也能被搜索引擎青睐!

2025-08-01 17:56:13 1058

原创 Vue性能优化实战:让你的应用快如闪电⚡

今天就来分享一些实战中超级实用的Vue性能优化技巧,让你的应用从"卡成PPT"变成"丝滑如德芙"!

2025-08-01 16:54:01 795

原创 让页面“记住自己“——前端状态保留实战技巧

大家好,我是小杨,一个摸爬滚打了6年的前端老司机。今天咱们聊一个实际开发中高频出现的场景:从A页面跳转到B页面,返回时如何让A页面保持原来的状态?

2025-08-01 16:48:44 452

原创 svg无数据图片记录,直接CV就可以用

【代码】svg无数据图片记录,直接CV就可以用。

2025-08-01 13:28:38 206

13_项目打包.md

13_项目打包

2023-09-01

04_Vue-CLI脚手架.md

04_Vue-CLI脚手架

2023-09-01

03_Vue-webpack.md

03_Vue-webpack

2023-09-01

02_Vue组件.md

02_Vue组件

2023-09-01

01_Vue基础.md

01_Vue基础

2023-09-01

05_Vue路由.md

05_Vue路由

2023-09-01

07_Vue_网络请求.md

07_Vue_网络请求

2023-09-01

04-rem适配布局.md

04-rem适配布局

2023-09-01

05-响应式布局.md

05-响应式布局

2023-09-01

02-流式布局.md

02-流式布局

2023-09-01

06-补充总结-利用视口单位适配页面.md

06-补充总结-利用视口单位适配页面

2023-09-01

03-flex布局.md

03-flex布局

2023-09-01

07-Sass语法学习笔记.md

07-Sass语法学习笔记

2023-09-01

03-原生ajax操作.md

03-原生ajax操作

2023-09-01

03-flex布局.zip

03-flex布局

2023-09-01

02-ajax及http协议概述.md

02-ajax及http协议概述

2023-09-01

04-rem布局.zip

04-rem布局

2023-09-01

02-流式布局.zip

02-流式布局

2023-09-01

01-移动端基础知识.md

01-移动端基础知识

2023-09-01

06_Vue_状态管理.md

06_Vue_状态管理

2023-09-01

前端开发WebSocket封装实现断网重连与自动心跳:提升实时数据传输稳定性及用户体验

内容概要:本文详细介绍了如何封装一个支持断网重连和自动心跳的WebSocket客户端。首先强调了WebSocket在前端开发中的重要性,并展示了官方API的基本用法。接着,文章通过创建一个自定义的WebSocketClient类,逐步实现了以下功能:初始化连接、处理各种事件(如打开、消息、关闭、错误)、发送消息、关闭连接。在此基础上,进一步添加了断网重连机制,包括记录重连次数、设置最大重连次数和重连间隔,以及在连接关闭或发生错误时自动尝试重连。最后,实现了自动心跳功能,通过定时发送心跳消息来保持连接活跃,并在一定时间内未收到响应时触发重连。整个封装过程保持了与官方API一致的使用方式,降低了学习成本。 适合人群:具备一定前端开发经验,尤其是对WebSocket有一定了解的研发人员。 使用场景及目标:①需要实现实时数据推送的应用场景,如股票行情、聊天室等;②确保在网络不稳定的情况下,前端能够自动恢复与服务器的连接;③通过心跳机制保证连接的活跃性,避免因长时间无数据传输导致的连接中断。 阅读建议:读者应结合实际项目需求,理解每个功能模块的设计思路和技术实现细节,特别是在断网重连和心跳机制部分。同时,建议读者亲自调试代码,体验封装后的WebSocketClient在不同网络环境下的表现。

2025-06-05

个性图标鼠标悬浮动画效果

个性图标鼠标悬浮动画效果

2025-02-17

热成像项目资源.zip

热成像项目资源.zip

2024-09-12

excel数据转换成波形图封装.html

将 Excel 数据转换成波形图(Waveform Chart)可以帮助你更好地可视化时间序列数据或信号波形。以下是一个简要的概述,介绍如何将 Excel 数据转换成波形图以及所需的步骤和工具: 什么是波形图? 波形图是一种用于显示随时间变化的信号的图表类型,常用于音频信号、电子信号、传感器数据等领域。它可以帮助你观察数据的变化趋势、频率特征和波动模式。

2024-09-11

excel热成像封装+双线性插值算法

热成像技术在工业、医学和科学研究中发挥了重要作用,它能够通过捕捉不同物体的温度分布图像来提供宝贵的信息。然而,要有效地展示和分析这些热成像数据,我们需要使用适当的工具和算法。本文将介绍如何使用Excel展示热成像数据,并实现插值算法以增强数据分析的准确性和可视化效果。

2024-09-11

00-客户端服务器概念说明.md

00-客户端服务器概念说明

2023-09-01

06-axios.md

06-axios

2023-09-01

05-fetch.md

05-fetch

2023-09-01

09-表单-补充.md

09-表单-补充

2023-09-01

01-json-server服务器.md

01-json-server服务器

2023-09-01

04-jquery-ajax操作.md

04-jquery-ajax操作

2023-09-01

07-图书管理案例-axios版.md

07-图书管理案例-axios版

2023-09-01

面试题集合-2022最新版.txt

面试题集合-2022最新版

2023-09-01

衣服尺码选择功能.html

衣服尺码选择功能

2024-01-26

用html和css实现五星红旗

要用HTML和CSS实现五星红旗,首先需要明确五星红旗的结构。五星红旗总共由两个部分组成:红色背景和五颗黄色五角星。因此,我们可以利用HTML中的div标签作为容器,来实现五星红旗的布局。 要用HTML和CSS实现五星红旗,可以按照以下步骤进行: 创建一个包含五颗黄色五角星的容器。可以使用div标签,并为其添加一个类名或id作为选择器。 通过CSS设置容器的宽度和高度,以及背景颜色为红色。可以使用width、height和background-color属性来实现。 使用CSS绘制五角星。可以通过伪元素(如:before和:after)来创建五角星的不同部分,使用border属性设置边框样式,以及transform属性进行旋转和定位。 调整五角星的大小和位置,使它们按照正确的比例和排列方式显示在红色背景中。可以使用margin、padding和position等CSS属性来进行调整。 根据设计需求,可能需要添加其他样式,如设置容器居中显示、调整五颗星之间的间距等。同时祝祝祖国母亲生日快乐

2023-10-07

前端面试宝典V4.0.pdf

前端面试宝典V4.0

2023-09-01

伪类选择器.png

伪类选择器

2023-09-01

axios.js

axios

2023-09-01

附1:接口文档.md

附1:接口文档

2023-09-01

08-图书管理案例-jquery版.md

08-图书管理案例-jquery版

2023-09-01

空空如也

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

TA关注的人

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