- 博客(44)
- 收藏
- 关注
RSS订阅原创 前端大文件分片上传实现与断点续传方案（含完整代码讲解）
本文介绍了一种大文件上传的解决方案，采用分片上传+断点续传+秒传校验的方式解决传统上传方式的问题。核心实现包括：1）前端自动切片（默认5MB/片）；2）查询已上传分片实现断点续传；3）分片上传与校验；4）所有片段上传完成后自动合并。文章提供了完整的代码示例，详细解析了切片、断点续传、分片校验等关键逻辑，并说明了与后端的交互方式。该方案具有逻辑清晰、易接入UI框架、支持秒传等优势，特别适合大文件上传场景。
2025-12-01 13:54:40
1031
原创 基于 Vue3 封装大华 RTSP 回放视频组件（PlayerControl.js 实现）
本文介绍了在Vue3项目中封装大华视频回放组件的实现方案。针对浏览器无法直接播放RTSP流的问题，采用PlayerControl.js SDK和RTSP-over-WebSocket技术实现视频播放。组件封装了播放器生命周期管理、参数自动重载、错误处理等功能，支持通过props控制播放参数（通道号、时间段等）。文章详细说明了SDK引入方式、核心代码实现（包含RTSP URL拼接、播放器初始化等）、使用方法以及常见问题排查，提供了一套完整的可复用解决方案。该方案不仅适用于大华设备，也可扩展应用到其他厂商的视频
2025-11-11 17:39:55
603
原创 从零运行一个最简 Electron + Vue3 桌面应用（完整入门教程）
本文提供了一个快速搭建Electron+Vue3+Vite桌面应用的详细指南。从环境准备到项目创建，详细介绍了如何安装Electron依赖、配置主进程文件，以及修改package.json脚本。通过简明的步骤说明，开发者只需复制命令即可创建并运行一个基础桌面窗口。解决方案中使用wait-on和concurrently工具实现前后端并行启动，并针对开发和生产环境提供了不同的加载方式。最终通过npm run dev命令即可启动包含Vue3欢迎页面的Electron应用，为后续开发功能奠定基础。
2025-10-29 14:40:59
461
原创 ECharts 实时数据平滑更新实践（含 WebSocket 模拟）
本文介绍了实现平滑动态数据可视化的方案。通过监听数据流变化，利用setOption局部更新而非全量重绘，解决折线图闪烁问题。示例模拟WebSocket每秒推送数据，图表平滑左移并自动移除旧数据。关键点包括深度监听数据变化、限制显示点数、优化动画参数等。这种方案适用于实时监控、IoT等需要流畅展示动态数据的场景，相比全量更新能显著提升视觉效果和性能。
2025-10-20 15:37:22
261
原创 Vue3 + Element Plus 弹框树形结构首次打开不更新问题排查与解决
摘要： 在Vue3+ElementPlus开发中，使用el-tree组件时首次打开弹框显示旧数据的问题，源于Vue响应式更新与DOM渲染的异步性。解决方案包括：1. nextTick 等待DOM更新；2. v-if强制重渲染 组件；3. 弹框@open事件 自动刷新数据。推荐组合方案：更新数据后通过nextTick和v-if确保首次加载正确。该问题揭示了Vue异步更新与组件初始化渲染的机制，理解时序是解决类似问题的关键。（150字）
2025-10-20 14:00:37
582
原创 前端实现 MD5 + AES 加密的安全登录请求
本文介绍Vue项目中实现安全登录的方案：前端先对密码进行MD5哈希，再用AES加密，最后以x-www-form-urlencoded格式发送给后端。详细说明了加密工具封装、依赖安装、接口改造和调用流程，强调key/iv需与后端一致，并提醒HTTPS仍是必要保障。该方案通过双重加密提升密码传输安全性，同时适配后端解析要求。
2025-08-11 14:48:57
342
原创 基于 Vue + 高德地图实现卫星图与 Mapbox 矢量瓦片
本文介绍了基于Vue3+高德地图JSAPI实现卫星底图与矢量数据融合渲染的技术方案。通过Mapbox矢量瓦片(PBF格式)，可灵活定制车道线、标线等交通元素的显示样式，叠加在高德卫星影像上。文章详细讲解了地图初始化、卫星底图加载、矢量瓦片图层创建与样式设置等核心实现步骤，并提供了性能优化建议和扩展思路。该方案适用于智慧交通、城市规划等需要高定制化地图可视化的场景，具有灵活性强、性能优越的特点。
2025-08-08 17:08:59
1289
原创 基于 Vue3 + ECharts 实现渐变分段折线图：支持动态区间、响应式渲染与颜色控制
本文介绍了基于Vue3+ECharts开发的渐变分段折线图组件，适用于空气质量、路况指数等需要按数值区间动态变色展示的场景。组件核心功能包括：支持传入valueList控制颜色分段，自动生成渐变效果，响应式自适应窗口大小，以及数据变更自动重绘。通过getSegmentsByType方法可灵活配置不同业务类型的分段策略，使用线性渐变实现平滑过渡。组件采用ResizeObserver监听尺寸变化，watch监听数据更新，具有高度可复用性，并支持未来扩展多线绘制、动态提示等进阶功能。
2025-07-22 11:16:12
1075
原创 Vue + WebSocket 实时数据可视化实战：多源融合与模拟数据双模式设计
本文介绍了一个基于Vue3和ECharts的多WebSocket数据源实时可视化解决方案。核心功能包括：支持4个WebSocket数据源连接与自动重连机制，提供模拟数据接口方便开发调试；通过响应式状态管理合并各数据源的车流总量和车辆类型分布数据；使用ECharts动态渲染饼图展示统计结果，并优化了视觉效果。方案采用模块化设计，包含数据连接、合并计算、格式化处理和图表渲染等完整流程，特别适合交通监控等需要实时数据可视化的大屏项目，兼顾开发效率和系统稳定性。
2025-07-22 10:31:34
880
原创 Vue3 + Element Plus 实现树形结构的“单选 + 只选叶子节点 + 默认选中第一个子节点”
本文介绍如何在Vue3中使用ElementPlus的<el-tree>组件实现树形选择功能，重点解决三个需求：1)只允许勾选叶子节点；2)实现单选模式；3)页面加载时默认选中第一个子节点。通过设置check-strictly属性允许父子节点独立勾选，利用check-change事件监听控制只能选择叶子节点并保持单选逻辑。同时给出了初始化默认选中第一个子节点的实现方法。适用于菜单选择、权限管理等业务场景，建议封装为可复用组件。文末提供了完整代码获取方式。
2025-05-29 16:31:44
1763
原创 Vue3 + 高德地图实现围栏绘制与线路渲染（含 GeoJSON 支持）
本文介绍了基于Vue3和高德地图JSAPI实现的地图功能模块开发，包含地图初始化、GeoJSON数据加载、区域围栏绘制与编辑、遮罩层渲染等核心功能。文章详细讲解了技术栈配置、地图基础设置、GeoJSON线路数据解析方法、围栏交互绘制流程，以及遮罩层实现技巧和常见层级问题解决方案。该模块适用于交通可视化、轨迹管控等场景，具有灵活扩展性，支持后续集成热力图、3D轨迹等进阶功能开发。
2025-05-28 10:34:31
1008
原创 Vue 3 实现后端 Excel 文件流导出功能（Blob 下载详解）
本文详细介绍了在Vue3项目中如何利用Axios调用后端接口处理文件流，实现Excel自动下载功能。文章首先概述了后端接口的请求方式和响应格式，接着阐述了前端实现思路，包括通过responseType: 'blob'获取流数据，创建URL链接，并使用<a>标签触发下载。此外，文章提供了完整的代码示例，涵盖了接口封装和Vue组件中的导出方法实现。最后，文章总结了常见问题及其解决方案，并展示了功能效果。通过本文，读者可以快速掌握在Vue3项目中实现Excel导出功能的技巧。
2025-05-15 13:29:57
1780
3原创 全球首位AI程序员诞生，将会对程序员的影响有多大？
但同时，新的岗位可能会涌现，例如AI模型的设计、训练和优化，以及与AI系统集成和维护相关的工作。情感理解：AI程序员缺乏对情感和人类行为的理解能力。持续学习和进化：AI程序员能够不断学习和进化，通过分析大量的数据和代码，积累经验并改进自身的算法和模型，从而不断提升自身的开发能力和效率。：在AI时代，技术更新迅速，程序员应不断学习新的技术和工具，保持敏锐的观察力和学习能力，以适应行业发展的变化。：AI的发展可能改变传统的编程方式，程序员需要具备创新思维，积极探索新的编程范式和方法，以适应技术发展的需求。
2024-03-20 15:13:35
536
原创 Vue 3 + Vite 开发项目
Vue 3 + Vite 是一个新兴的、前景广泛的技术组合，它提供了更好的开发体验和更高的可维护性，并且也是现代化 Web 开发的一个优秀方案，未来也将在各种领域中得到广泛应用。更多的社区支持：由于 Vue 自身拥有强大的社区支持，并且 Vite 也已经成为了开发领域中的新秀，因此 Vue 3 + Vite 能够获得更多的支持和帮助。更好的可维护性：Vue 3 的组合式 API 和 Vite 的即时重载等功能都能够提供更好的开发体验，并能够使开发人员更轻松地维护代码。
2023-06-07 16:32:25
262
原创 Vue.js3.x新特性和相关知识
在Vue.js的进化历程中，3.x版本是一个更加现代化、更优雅、更灵活和更强大的版本。在本篇博客中，我们介绍了Vue.js3.x的新特性，例如Composition API、静态属性、emit事件等等。然而，Vue.js在其最新的版本Vue.js3.x中提供了许多新特性和改进，使得我们开发更出色的web应用程序。- 更好的响应式系统：Vue.js3.x的响应式系统也得到了改进，不仅增加了更多的API，而且还增加了对Map和Set等JavaScript内置数据结构的支持。
2023-05-06 10:49:28
259
原创 echart图表合集
echarts--------柱状图（x轴为两个模块数据版本，柱子顶部自定义背景图加自定义数据）最近做个项目运用大量echarts图表特此记录一下，以备后面不时之需！echarts-------仪表图（双指针 两个数据）echarts-------------横向进度条。echarts-----饼状图（颜色渐变）样式图片如下后续可根据自己需要按需修改。1，2，3 echarts图表代码。echarts--------水球图。echarts------环形图表。echarts-仪表速度图。
2022-11-03 14:26:59
5378
基于 Vue3 封装大华 RTSP 回放视频组件（PlayerControl.js 实现）
2025-11-11
有沒有技术大拿 知道这个开源项目 如何将地图变成中文的
2025-04-24
vue-draggable-resizable
2025-03-31
vue中elementUi日期选择器
2024-01-15
chatgpt next web 创建自己的gpt项目
2023-07-21
vue中使用高德地图
2023-06-20
关于#数组#的问题，如何解决？
2023-01-09
TA创建的收藏夹 TA关注的收藏夹
TA关注的人