- 博客(64)
- 收藏
- 关注
RSS订阅原创 前端调试HTTP状态码
表示需要客户端采取进一步操作才能完成请求，通常用于重定向。这类状态码表示临时响应，需要客户端继续处理请求。表示客户端可能存在错误，导致服务器无法处理请求。表示请求已成功被服务器接收、理解并处理。表示服务器在处理请求时发生内部错误。
2025-06-09 15:07:57
405
原创 使用 XState 状态机打造英语单词学习界面（demo）
我们的项目是一个英语单词学习应用，用户可以学习一系列单词，包括单词的含义、词组和例句。应用通过状态机来管理学习流程，根据用户的输入和操作，在不同的学习阶段之间进行切换。通过使用 XState 状态机，我们成功地构建了一个功能丰富、交互流畅的英语单词学习界面。状态机的使用使得学习流程的管理变得清晰、可维护，同时也方便了我们进行调试和扩展。如果你也在处理复杂的用户交互和状态管理问题，不妨尝试使用 XState 来提升你的开发效率和代码质量。t=P4F5。
2025-06-06 17:40:52
1231
原创 微信开发者工具与VSCode联合开发小程序指南
在 VSCode 中编辑小程序的代码，例如在 pages 文件夹下新建一个页面，然后在 app.json 文件中配置新页面的路径，使其能够在小程序中访问。在 VSCode 中，点击菜单栏的 “文件”->“打开文件夹”，选择刚才在微信开发者工具中创建项目时指定的项目目录。体验者使用微信扫描微信开发者平台中体验版小程序的二维码，或者在微信中搜索小程序名称（需要管理员在微信开发者平台中设置好小程序名称），即可进入体验版小程序，进行功能测试和体验。在开发管理页面的 “开发版本” 栏中，可以看到刚才上传的代码版本。
2025-06-06 17:09:32
817
原创 前端常见错误
代码中存在语法错误（如括号未闭合、缺少分号、引号不匹配）。：网络请求失败（如跨域问题、服务器未响应、URL 错误）。：Promise 被拒绝（rejected）但没有。：递归函数没有终止条件，导致无限循环调用。：尝试将无效的节点添加到 DOM 中（如。：引用了一个未定义的变量、函数或模块。：在打包或编译时找不到指定的模块。：尝试调用一个非函数类型的变量。对象的属性 / 方法。：在类方法或回调函数中，或重复添加同一节点）。
2025-06-05 17:12:18
360
原创 HBuilder 发行Android（apk包）全流程指南
小程序以其便捷性和轻量性受到越来越多开发者的青睐。HBuilder 作为一款强大的开发工具，为小程序开发提供了极大的便利。本文将详细介绍如何通过 HBuilder 完成小程序的开发与发行。pages目录：存放小程序的页面文件static目录：存放静态资源文件，如图片、样式等App.vue：小程序的全局配置文件main.js：小程序的入口文件：小程序的全局配置，包括应用名称、图标、权限等pages.json：小程序的页面路径、窗口样式等配置。
2025-06-05 16:09:06
981
原创 简单实现Ajax基础应用
Ajax不是一种技术，而是一个编程概念。HTML 和 CSS 可以组合使用来标记和设置信息样式。JavaScript 可以修改网页以动态显示，并允许用户与新信息进行交互。内置的 XMLHttpRequest 对象用于在网页上执行 Ajax，允许网站将内容加载到屏幕上而无需刷新页面。Ajax不是一种新技术，也不是一种新语言。相反，它是以新方式使用的现有技术。下面为你介绍 AJAX 的基础应用，我会通过原生 JavaScript 和 Fetch API 两种方式来实现一个简单的示例。
2025-06-03 09:40:09
463
1
原创 ES6新特性及简单使用
绑定取决于上下文（继承自外层作用域），而非像传统函数根据调用方式确定。用反引号（`）包裹，可嵌入表达式，支持多行文本，无需像传统字符串那样进行拼接或转义。用于处理异步操作，解决回调地狱问题，提供更优雅的链式调用和错误处理方式。基于原型的语法糖，以更接近传统面向对象语言的方式定义类，包含构造函数（）和实例方法等，本质仍是对构造函数和原型链机制的封装。关键字实现原生模块化，利于代码复用和组织。提供简洁的函数定义语法，语法上省略了。用于遍历可迭代对象（如数组、遍历的是对象的键（索引）。（已失败）三种状态。
2025-05-30 13:46:53
361
原创 npm、pnpm、yarn使用以及区别
三者选择上，追求速度和磁盘空间效率选 pnpm；大型项目需一致性和安全检查选 yarn；看重生态丰富和灵活性选 npm。yarn <脚本名>
2025-05-30 13:30:45
861
原创 一文读懂 Webpack 与 Vite：原理、流程与差异
Webpack 如同经验丰富的老工匠，凭借强大的功能和高度的可定制性，能够精心雕琢大型复杂项目；而 Vite 则像身手敏捷的新锐，以轻量快速的特点，为小型项目和追求极致开发体验的场景带来福音。开发者可以根据项目的规模、复杂度以及开发需求，合理选择适合的构建工具，让前端开发工作更加高效顺畅。
2025-05-29 18:10:12
478
原创 JavaScript 中的防抖与节流：高效处理高频事件的秘密武器
防抖和节流作为 JavaScript 中优化高频事件的重要手段，在提升应用性能和用户体验方面发挥着关键作用。无论是搜索框的输入优化，还是页面滚动的性能提升，合理运用这两种技术，都能让我们的代码更加优雅和高效。在实际开发中，我们需要根据具体的业务场景和需求，灵活选择防抖或节流，为用户打造流畅的交互体验。。
2025-05-29 14:58:49
473
原创 JavaScript 中 this 指向全解析：从基础到 Vue 应用
理解 JavaScript 中this的指向需要结合函数的调用方式和上下文环境。从全局上下文到对象方法，从构造函数到箭头函数，this的指向灵活多变。在 Vue 框架中，this的行为也因 API 风格而异。通过掌握这些规则和最佳实践，可以更好地编写 JavaScript 代码，避免因this指向问题导致的错误。
2025-05-28 11:03:19
604
原创 Jquery常见语法以及运用
jQuery 是一个快速、简洁的 JavaScript 库，设计宗旨是（写得更少，做得更多）。它封装了常见的 DOM 操作、事件处理、动画效果和 AJAX 交互，大大简化了开发者与 HTML 文档的交互过程。jQuery 的核心是通过 $()（别名jQuery()）来选择 HTML 元素，然后对其执行操作。
2025-05-26 13:54:30
376
原创 高德地图路径规划功能
在基于 Vue 和高德地图开发地理信息系统时，除了基础的地图展示和标点功能，路径规划是一个常见的扩展需求。本文将结合实际项目场景，分享如何在现有组件中快速集成高德地图的驾车路线规划功能。
2025-05-26 13:01:58
1579
原创 深入探索 CSS 中的伪类：从基础到实战
在前端开发的世界里，CSS 作为网页样式的 “化妆师”，有着至关重要的作用。而 CSS 伪类则像是这位 “化妆师” 手中的神奇画笔，能够基于元素的状态或位置为其添加独特的样式，极大地丰富了网页的交互性和视觉效果。接下来，我们就深入了解一下 CSS 中常见的伪类类型及其使用方法。。
2025-05-23 11:40:51
1000
原创 深入理解 BFC：网页布局的关键机制
BFC 即块级格式化上下文，它就像是网页布局中的一个 “独立王国”。在这个区域内，规定了内部的块级元素如何进行布局，并且与外部元素相互隔离。这意味着在 BFC 内部的元素布局规则，不会受到外部元素的干扰，反之亦然。这种隔离特性使得我们在进行复杂网页布局时，可以更精确地控制元素的位置、尺寸以及相互之间的关系。
2025-05-22 11:16:15
897
原创 深入剖析大模型生态：各组件的协同与运作
在人工智能飞速发展的当下，大模型成为了众多前沿应用的核心驱动力。今天，让我们围绕图中的几个关键元素，深入探讨它们在大模型体系中的角色与相互关系。
2025-05-22 11:15:36
702
原创 高效协同量产平台：轻松实现内容批量生成
公司内部人员使用太顺手了！最近发现一款超实用的量产平台 ——，它深度结合石墨文档，为内容创作带来了全新的效率革命，尤其适合企业内部进行批量内容生产。
2025-05-21 15:07:46
438
原创 《从虚拟 DOM 到 Diff 算法：深度解析前端高效更新的核心原理》-简版
通过以上内容介绍，可以清晰看到虚拟 DOM 如何通过 JS 对象描述 DOM 结构，Diff 算法如何高效找出差异，以及补丁如何最小化更新真实 DOM。（例如：频繁操作引发回流 / 重绘，JS 与 DOM 交互效率低）它们通过 “以 JS 对象模拟 DOM 结构 + 最小化真实 DOM 操作” 的方式，大幅提升前端应用的更新效率。：将虚拟 DOM 对象（JS 对象）转换为真实 DOM 元素。：根据 Diff 生成的补丁（Patch），更新真实 DOM。：对比新旧虚拟 DOM，生成差异补丁（Patch）。
2025-05-21 14:52:34
1386
原创 实用 Git 学习工具推荐：Learn Git Branching
Learn Git Branching 是一个面向开发者的交互式 Git 学习平台，专为那些希望通过实践掌握 Git 高级用法的用户设计。网站采用游戏化的界面和渐进式挑战，让复杂的 Git 概念变得直观易懂。无论是初学者还是需要复习高级技巧的开发者，都能从中获益。Learn Git Branching 以其直观的界面和丰富的示例，让 Git 学习变得有趣且高效。通过完成各个挑战，用户不仅能掌握命令的使用，更能培养良好的 Git 使用习惯，是 Git 学习者的优质资源。如果觉得这个网站使用起来。使用建议补充。
2025-05-20 09:56:46
290
原创 基于 Vue 和 Node.js 实现图片上传功能：从前端到后端的完整实践
本文将基于一个旅拍社交分享系统，详细解析其图片上传功能的实现原理和技术细节，包括前端处理、后端接收和数据库存储等环节。这种实现方式不仅适用于旅拍社交系统，也可应用于各种需要图片上传功能的 Web 应用中。通过合理的架构设计和安全措施，可以构建出高效、稳定的图片上传服务。通过这个项目的实现，我们可以看到图片上传功能的完整流程：从前端表单选择，到后端接收存储，再到最终展示。对象，后端使用合适的中间件处理文件，并将文件路径与业务数据关联。组件中实现，用户可以通过表单选择图片并提交到服务器。
2025-05-19 10:57:36
1111
原创 编写大模型Prompt提示词方法
在实际开发中，需要对返回的 JSON 结果进行处理。通过以上步骤，你可以在实际开发中有效地编写提示词，并处理大模型返回的结果。注意⚠️：仅供参考！
2025-05-08 15:03:21
596
原创 使用 React 实现语音识别并转换功能
我们要实现的功能是一个语音识别测试页面，用户可以选择不同的语言，录制音频，然后将录制的音频转换为文本。整个过程使用了 React 作为前端框架，RecordRTC库用于录制音频，以及一个自定义的CallAsr函数用于调用语音识别服务。CallAsr前端 AI 开发实战：基于自定义工具类的大语言模型与语音识别调用指南_音频理解类大模型调用-CSDN博客为了更好地处理语音识别服务的返回数据，我们定义了一个接口。data?
2025-05-08 14:00:23
1461
原创 浏览器存储 Cookie，Local Storage和Session Storage
存储容量：一般为 5MB 左右，不同浏览器可能存在差异。数据有效期：除非手动删除，否则数据不会过期，会一直存储在浏览器中。数据共享：在同一域名下，不同页面可以共享数据。数据存储和读取：使用setItem方法存储数据，getItem方法读取数据。不支持在不同浏览器共享数据。一网站只能访问自己域下的LS。示例代码：// 存储数据localStorage.setItem('username', '打小就很皮');// 读取数据存储容量：与类似，通常为 5MB 左右。数据有效期。
2025-05-06 17:59:26
498
原创 手写Promise.all
接收一个可迭代对象（通常是数组）作为参数，该数组中的每个元素都是一个 Promise 对象，当所有 Promise 都成功完成时，它会返回一个新的 Promise，该 Promise 会在所有 Promise 都成功时以一个包含所有结果的数组来解析；函数，它接收一个 Promise 数组作为参数，返回一个新的 Promise 对象。在函数内部，通过遍历传入的 Promise 数组，为每个 Promise 绑定。当所有 Promise 都成功完成时，将每个 Promise 的结果存储在。
2025-05-06 14:34:06
272
原创 一文读懂 JavaScript 中的深浅拷贝
深浅拷贝在 JavaScript 开发中至关重要。浅拷贝适用于基本数据类型为主，且部分引用数据类型修改可共享的场景；深拷贝则用于需要确保数据完全独立，避免相互干扰的情况。通过这些简单的 “abc” 示例和浏览器控制台的实践，希望大家对深浅拷贝有更清晰的认识，在今后的代码编写中能够游刃有余地处理数据。
2025-04-29 17:46:43
456
原创 前端 AI 开发实战：基于自定义工具类的大语言模型与语音识别调用指南
ZH_CN = "zh", // 简体中文YUE_CN = "yue-cn", // 粤语EN_US = "en", // 美式英语// 其他语言...通过SupportLLM和枚举，将支持的大语言模型名称和语音识别语种进行标准化定义，方便后续代码调用和维护，避免硬编码带来的问题。
2025-04-29 16:43:26
977
原创 高德地图 API 配置指南：地图初始化与标点弹窗开发全流程
console.log(“地理位置信息”, target, lnglat, pixel, type)})注意：插入到initMap初始化方法中。markPoints方法：在地图上添加标记点。：监听地图的点击事件，并打印相关信息。本文通过较完整的流程，展示了如何基于高德地图 API 实现地图初始化、标点添加及弹窗交互功能。从账号注册到代码调试，核心步骤均搭配具体代码示例和逻辑说明，帮助开发者快速掌握从 “零” 到 “功能落地” 的全流程。
2025-04-27 17:48:35
1022
原创 快速使用工具Cursor
在这个整体的Cursor界面 我让其去简单的实现了一个根据日文句子来进行词的拆分、词的查重去重以及标点的去处等。：可以将原型图的图片导入到对话框中，这样它会按照你给的要求以及图片逐步复刻界面。这个工具会很快的去创建出该有的组件和代码，执行之前下载pnpm或者npm都可以。大致描述： 我要做一个通过阅读句子，收集单词并学习的APP，3、功能按钮：Start，点击进入阅读界面。1.、展示书名、作者名字、书的封面。2、展示进度（假的，写死）
2025-04-18 16:31:34
335
原创 前端性能优化指南
前端项目优化是一个综合性的工作，涉及代码层面、资源加载、构建工具以及缓存策略等多个方面。通过合理运用代码拆分、懒加载、图片优化、构建工具优化以及缓存策略等技术，可以显著提升前端项目的性能，为用户提供更加流畅、高效的体验。在实际项目中，需要根据项目的特点和需求，有针对性地选择和实施优化策略，不断提升前端应用的质量。
2025-03-14 20:38:06
482
原创 H5如何实现与PC页面的通信
通过API，我们可以轻松实现H5页面与PC页面之间的通信。这种方法不仅简单易用，而且能够在不同的域之间进行安全的消息传递。在实际应用中，我们需要确保消息来源的可信性，以防止潜在的安全风险。希望本文能为您在实现H5与PC页面通信时提供一些参考和帮助。
2024-12-23 18:37:31
452
原创 H5 中 van-popup 的使用以及题目的切换
引入van-popup组件在 Vue 项目中引入vant组件库，并使用van-popup组件实现弹窗效果。弹窗内容的条件渲染根据不同的题目类型（如互动题和练习题），在弹窗中显示不同的内容。题目详情的展示使用computed属性计算当前题目的详情，并在弹窗中展示题目的相关信息。题目的切换通过按钮实现题目的上一题和下一题的切换，并更新当前题目的索引。
2024-12-18 18:53:34
1533
原创 小程序中使用 Vue2 + Vuex 实现数据存储与获取
定义 Vuex 模块：在目录下定义 Vuex 模块，管理相关的 state、getters、mutations 和 actions。在组件中使用 Vuex 数据：通过mapGetters和mapActions将 Vuex 的 state 和 actions 映射到组件的 computed 和 methods 中。使用本地存储：在需要持久化数据的地方使用和进行本地存储和读取。通过这种方式，我们可以更好地管理小程序中的数据，提升代码的可维护性和可读性。
2024-12-18 11:25:10
948
原创 解决小程序中ios可以正常滚动，而Android失效问题
经过一番调试和研究，我找到了一种可靠的解决方案，结合了 Intersection Observer 和传统的滚动事件监听，确保在所有设备上都能正常工作。通过结合 Intersection Observer 和传统的滚动事件监听，我们可以确保在所有设备上都能正常工作，并且避免重复加载数据的问题。在 iOS 设备上，这个功能可以正常工作，但在 Android 设备上，滚动事件无法正常触发，导致无法加载更多数据。： Intersection Observer 是一种现代的 API，可以用来检测元素是否进入视口。
2024-12-17 17:29:19
784
原创 浏览器中输入一个URL后，浏览器经历的整个过程
这个过程涉及到网络、协议、浏览器内核等多个方面的知识，是Web开发和优化的重要基础。希望这个详细的描述对你有所帮助！
2024-12-04 18:46:28
1432
原创 如何优化前端性能
在现代Web开发中，前端性能优化是一个非常重要的课题。用户对网站的加载速度和响应时间有着极高的期望，任何延迟都可能导致用户流失。本文将分享一些前端性能优化的技巧和最佳实践，帮助你提升网站的性能。
2024-12-04 11:06:33
540
原创 Vue 3 + Vuex 埋点实现指南
通过本文的介绍，我们实现了一个基于 Vue 3 和 Vuex 的埋点系统。这个系统通过自定义 Hook封装了埋点逻辑，并在组件中方便地调用这些方法。这样不仅提高了代码的可维护性，还使得埋点逻辑更加清晰和模块化。⚠️具体实现根据实际情况修改即可希望这篇文章能帮助你更好地理解和实现 Vue 项目中的埋点功能。如果有任何问题或建议，欢迎在评论区留言讨论。
2024-11-29 10:59:52
741
原创 el-table只显示上半部分数据（显示不全）
问题排查：经过排查发现是当前的固定高度为500px，页面内只显示了此高度内的五条数据，而从第六条数据开始不显示其数据，可见是此表格的高度没有完全设置正确。
2024-11-27 16:07:09
480
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人