- 博客(100)
- 收藏
- 关注
RSS订阅原创 React 实现富文本（使用篇&Next.js）
而在 React 18 的**并发模式（Concurrent Mode）**或 **严格模式（Strict Mode）**下，这个 API 已经被废弃或限制使用，尤其是在 Next.js 或 Vite 环境中。可以有效避开 SSR 期间的报错以及 DOM 节点的引用冲突。在React 18版本下的使用应该是没有问题的！，在这个库在 React 18 环境下（特别是开启了。Next.js 或类似的 SSR 框架，对象，必须在客户端加载。时）存在已知的兼容性问题。
2025-12-19 17:43:12
93
原创 Vue2实现PC端高德地图选点功能
基于 Vue2 + 高德地图 JS API 2.0 实现 PC 端地址选点功能，支持定位当前位置、关键词搜索地址、地图点击选点、地址信息回显，采用父子组件分离设计，子组件封装地图核心能力，父组件通过弹窗调用并接收选点结果。
2025-12-17 13:27:53
160
原创 前端 Word 导出：自定义页眉表格的实现方案
布局：4 列 2 行结构，第二列合并两行显示核心信息内容：包含标识文本（VOSS、Job Description）、职位名称、版本信息（Issue No.）、日期（Issue Date）、编制人（Compiled By）、审批人（Approved By）样式：统一边框、文字居中对齐、固定列宽比例、垂直居中布局适配：页眉在文档每一页顶部显示，与正文内容分离列索引（宽比例）第 1 行内容第 2 行内容特殊配置列 1（25%）VOSS（标识文本）
2025-12-08 08:57:10
1121
原创 部署服务器遇到Eslint规则错误
这是因为在npm install全局下载了，没有按需下载造成eslint打开了，这个规则有时候就很烦人。这也是因为在前端项目中引入了Button、Checkout等却没有使用造成打包的问题。这是因为前端的package.json中引入了video库，但是并没有使用造成的。src根目录下创建.eslintrc.js文件关闭eslint即可。
2025-11-28 10:22:32
224
原创 前端实现接口公开访问（后端鉴权）
两种方式的前端适配逻辑完全一致（都是要去掉不必要的token和clientid），核心差异在后端的配置和鉴权逻辑方式一：接口本身无鉴权，直接公开访问；方式二：接口有全局鉴权，但通过白名单放行，配置更灵活、安全。推荐优先选择方式二（后端加白名单），因为后续如果需要调整白名单范围（比如新增类似路径），后端可以统一配置，无需修改接口逻辑；前端适配成本和方式一完全相同。headers: {// 清除拦截器默认添加的参数},});
2025-11-28 09:45:26
857
原创 轻量 URL 传参方案：查询参数跨页面数据传递实践文档
"简单暴力传参法"是一种通过URL查询参数(Query Parameters)在不同页面间传递数据的简单直接方法。这种方法适用于简单的数据传递场景，无需复杂的状态管理。
2025-11-26 14:22:06
136
原创 React 项目开发指南：脚手架搭建、Axios 封装与 Gitee 远程仓库配置
React 项目脚手架搭建- 使用 Create React App 快速创建项目Axios 二次封装- 统一的请求/响应拦截、错误处理、API 管理Gitee 远程仓库连接- 版本控制、自动化部署这套配置为 React 项目开发提供了完整的基础设施，能够提高开发效率，保证代码质量，并支持团队的协同开发。
2025-11-24 16:30:49
820
原创 React VideoPlay 组件封装与使用指南
VideoPlay 是一个基于 React 的高效视频播放器组件，提供了简洁的 API 和完整的播放控制功能，支持视频方向检测和响应式设计。VideoPlay 组件提供了简单易用的视频播放解决方案，通过合理的封装和完整的 API 设计，可以快速集成到各种 React 应用中。根据具体需求，您可以进一步扩展其功能或自定义样式。注意⚠：该组件仅供参考！！！
2025-11-21 15:29:52
544
原创 Zustand 状态管理库使用说明（含实战示例）
安装依赖：项目需先安装 zustand（），如需持久化需额外安装中间件（已包含在示例中）。存储创建流程：用create函数包裹状态和方法，通过set修改状态、get获取状态。需持久化时，用persist包裹create的回调函数，配置存储键名和存储方式。组件使用流程：导入对应存储（如解构需要的状态（如count）和方法（如increment直接在组件中绑定状态到 UI，绑定方法到事件（如onClick。
2025-11-13 14:41:25
1090
原创 基于 Dify 实现 AI 流式对话：组件设计思路（React）
通过封装 API 交互层（useDifyAgent）分离业务逻辑与 UI 渲染，同时设计合理的状态管理策略，让前端既能实时响应 AI 的流式输出，又能保持良好的用户体验。这种架构不仅适用于招聘场景，还可推广到客服、教育等需要 AI 实时交互的领域。关键在于理解流式响应的事件机制，以及如何设计组件间的通信方式，让整个流程清晰可维护。
2025-11-12 11:33:52
837
原创 本地前端独立开发（后端未启动）登录解决方案
利用测试环境已部署的后端服务（后端代码已提交至测试服），通过临时切换前端代理目标地址，先登录测试服获取有效 token，再将 token 复用至本地项目，实现本地前端免后端登录。本地启动 React+Vite 前端项目后，若后端服务未启动或本地后端环境异常，直接访问本地页面（如。）会因无法调用登录接口，导致无法正常登录系统，阻碍前端功能开发与调试。
2025-11-07 16:20:50
269
原创 利用 pdfjs-dist 打造React版PDF神器：链接转单页PDF组件全解析
这个基于 React 开发的 PDF 组件，旨在解决实际应用中链接形式 PDF 原件处理不便的问题，它的核心功能是将左侧带预览、右侧是实际 PDF 内容（以链接形式呈现的原件）转换为单个 PDF 格式的内容。在许多在线文档管理系统或电子阅读平台中，常常会遇到链接形式的 PDF 文档，用户需要点击链接跳转到新页面查看，并且无法直接对文档进行本地保存和常规的文件操作。
2025-11-07 14:52:41
1246
原创 前端新人入职必备：开发环境快速搭建
完成以上工具与环境的搭建，就具备了前端开发的基本条件：用 VS Code 编写代码，或者 Trae 来实现，通过 Git 管理代码版本，借助 Node.js 运行项目，最后用谷歌浏览器验证效果。◦ 开发模式选择：新手推荐先试用「SOLO 模式」（AI 主导开发，自动生成代码框架），熟悉后可切换「IDE 模式」（保留传统编码流程，手动控制开发节奏）；◦ 插件兼容：支持导入 VS Code 插件，无需重复配置，同时内置字节定制化插件（如内部接口调试、代码规范检查插件），适配字节系项目更高效。
2025-10-26 17:50:51
409
原创 互联网公司软件开发全流程规范文档
本文档旨在明确互联网公司软件开发的标准流程，覆盖从项目立项到正式上线的全生命周期，规范产品、前端、后端、测试等核心角色的职责与协作方式，确保每一期需求开发均能高效、有序推进，保障产品质量与交付效率。
2025-10-22 15:14:45
687
原创 深入理解 JavaScript 事件循环：从理论到实战
同步任务 → 所有微任务 → 一个宏任务 → 该宏任务产生的所有微任务 → 下一个宏任务...事件循环机制对于编写高效的 JavaScript 代码至关重要，尤其是在处理复杂的异步操作时。JavaScript 是单线程，通过事件循环处理异步操作任务分为同步任务、微任务和宏任务执行顺序：同步任务 → 所有微任务 → 宏任务（每次一个）每个宏任务执行完毕后，会先清空所有微任务再执行下一个宏任务。
2025-10-22 11:05:38
680
原创 Steps + Input.TextArea + InfiniteScroll 联调优化
modalInitialLoading 添加内容加载显示。
2025-10-21 10:29:21
207
原创 前端与后端 Node.js 比较
前端用 Node.js 是 “借环境跑工具”，为了开发前端代码；后端用 Express 是 “用 Node.js 做服务器”，直接开发后端业务。如需了解后端 Node.js 的 Express 框架请参考文章（其包含前端使用、后端开发、数据库使用、axios二次封装）：快速上手vue3+js+Node.js_vue3 nodejs-CSDN博客。
2025-10-20 11:24:46
944
原创 Steps + Input.TextArea 实现弹窗内容
每一条记录都需要展示候选人/更新时间，支持编辑与实时保存；注意⚠：本文只是提供参考，还未联调完善！以链路时间线的形式展示人才特征模型更新记录；列表无限向下滑动分页。
2025-10-17 16:13:34
238
原创 React does not recognize the `preventDefault` prop on a DOM element.
是一个方法，通常用于阻止事件的默认行为（如表单提交的页面刷新），而不是作为属性传递给 DOM 元素。作为属性传递给 DOM 元素的地方，将其移除，并在事件处理函数内部通过事件对象。这个错误提示表明你在某个 DOM 元素上使用了。作为属性，而 React 不认识这个属性。在你的代码中，找到将。
2025-10-16 14:01:31
176
原创 ShowCountCard 功能迭代：新增周月对比属性，完善数据可视化场景
该功能用于数据统计卡片的 “同比 / 环比比较展示”，适配 “对话次数、发起需求、职位发布、平均时间、筛选次数、合格候选人、人才简历库”7 类核心业务数据，支持 “全部时间、周、月”3 种时间维度切换，最终在前端卡片中显示 “较上周 / 较上月” 的数值变化，并通过颜色区分数值正负，帮助用户快速识别数据趋势。
2025-10-15 16:46:17
1082
原创 自定义 ShowCountCard 组件：数据可视化展示的灵活方案
在后台管理系统开发中，数据卡片是展示关键指标的常用元素。今天我想分享一个我们项目中自定义的组件，它通过灵活的属性配置，能够满足不同场景下的数据展示需求。
2025-10-14 17:47:04
625
原创 如何优雅区分前端列表的初始化空状态与筛选后空状态
在开发数据列表页面时，我们经常会遇到 "空状态" 展示的问题。最容易混淆的两种场景是：用户刚进入页面时的初始化空状态（确实没有任何数据），和用户进行筛选操作后的空状态（有数据但不符合筛选条件）。这两种场景需要展示不同的提示信息和操作指引，否则会给用户带来困惑。
2025-10-14 15:14:31
554
原创 大模型与智能体：别再混淆了！一张表讲清核心差异
简单来说，大模型解决的是 “知不知道” 的问题，智能体解决的是 “能不能做到” 的问题。随着 AI 技术的发展，未来我们看到的 AI 应用，大概率不会是纯粹的大模型或智能体，而是以 “智能体为载体、大模型为核心” 的组合形态 —— 毕竟比起 “能说会道”，“能办实事” 才是大多数人对 AI 的终极期待。
2025-10-13 15:58:58
460
原创 基于 React 的步骤条组件实现：根据状态动态展示流程进度
{ name: '发起审核', time: record.createTime },{ name: '部门审核中', time: record.departmentTime },{ name: '发起人确认', time: record.affirmTime },{ name: '领导审核中', time: record.leaderTime },{ name: '审核完成' }这个动态步骤条组件通过状态值与步骤完成情况的映射关系，实现了流程进度的可视化展示。
2025-10-10 14:51:31
515
原创 前端通用文件下载方案：从 Blob 流处理到实际业务落地
通用性：工具函数可复用于所有 Blob 流下载场景（Excel、PDF、ZIP 等）；健壮性：覆盖网络错误、业务错误、参数校验等场景，减少异常情况；可扩展性：支持进度监听、大文件分片（需后端配合）、多类型文件适配等扩展需求。在实际项目中，可根据后端接口约定、UI 库差异调整代码细节，但核心逻辑（Blob 流处理、下载触发、异常捕获）保持一致。希望本文能帮助你高效实现前端文件下载功能！
2025-10-09 10:33:07
1250
原创 前端数组去重：3 种常用方法原理与实战解析
在前端开发中，数组去重是高频出现的需求 —— 无论是处理接口返回的重复数据、过滤用户输入的重复选项，还是整理本地存储的列表数据，都需要通过去重保证数据的唯一性。本文将聚焦三种最常用的数组去重方法：Set 方法、filter + indexOf 方法、reduce 方法，从原理拆解到代码实战，带你彻底掌握数组去重的逻辑与应用场景。。
2025-09-28 16:33:35
1383
原创 React 实现 F5 刷新后 Tabs 激活状态不重置
整个逻辑本质是 “状态持久化”：将易丢失的 “组件内存状态”（useState）与 “浏览器持久化存储”（localStorage）绑定，刷新前把最新状态存到本地，刷新后从本地读状态初始化组件，从而实现 “刷新不重置” 的效果。该方案轻量无依赖，除了 Segmented，还可直接复用于 Ant Design Tabs、Radio 等需要保持状态的组件，只需替换 “存储键名” 和 “状态变量” 即可。
2025-09-28 11:41:02
378
原创 解决turbo中× Invalid task configuration
这表明项目配置了 13 个需要持续运行的任务 (persistent tasks)，而 Turbo 默认的并发数 (concurrency) 限制为 10。由于并发数不足以同时运行所有任务，导致构建失败。这个错误是由 Turbo 构建系统 (TurboRepo) 在执行并行任务时产生的。通过这些调整，应该能够解决 Turbo 并发数不足的问题，让你的开发环境正常运行。：根据你的 CPU 核心数和内存情况设置合理的并发数，避免资源过载。中定义任务之间的依赖关系，让 Turbo 更智能地管理任务执行顺序。
2025-06-16 10:33:29
415
原创 前端调试HTTP状态码
表示需要客户端采取进一步操作才能完成请求，通常用于重定向。这类状态码表示临时响应，需要客户端继续处理请求。表示客户端可能存在错误，导致服务器无法处理请求。表示请求已成功被服务器接收、理解并处理。表示服务器在处理请求时发生内部错误。
2025-06-09 15:07:57
516
原创 使用 XState 状态机打造英语单词学习界面（demo）
我们的项目是一个英语单词学习应用，用户可以学习一系列单词，包括单词的含义、词组和例句。应用通过状态机来管理学习流程，根据用户的输入和操作，在不同的学习阶段之间进行切换。通过使用 XState 状态机，我们成功地构建了一个功能丰富、交互流畅的英语单词学习界面。状态机的使用使得学习流程的管理变得清晰、可维护，同时也方便了我们进行调试和扩展。如果你也在处理复杂的用户交互和状态管理问题，不妨尝试使用 XState 来提升你的开发效率和代码质量。t=P4F5。
2025-06-06 17:40:52
1343
原创 微信开发者工具与VSCode联合开发小程序指南
在 VSCode 中编辑小程序的代码，例如在 pages 文件夹下新建一个页面，然后在 app.json 文件中配置新页面的路径，使其能够在小程序中访问。在 VSCode 中，点击菜单栏的 “文件”->“打开文件夹”，选择刚才在微信开发者工具中创建项目时指定的项目目录。体验者使用微信扫描微信开发者平台中体验版小程序的二维码，或者在微信中搜索小程序名称（需要管理员在微信开发者平台中设置好小程序名称），即可进入体验版小程序，进行功能测试和体验。在开发管理页面的 “开发版本” 栏中，可以看到刚才上传的代码版本。
2025-06-06 17:09:32
3623
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人