- 博客(231)
- 收藏
- 关注
RSS订阅
原创 深入理解 Pinia：从基础到进阶的完整指南
无构建步骤限制：无需额外配置，支持任意构建工具（Vite/Webpack/Rollup）完整的 TypeScript 支持：接口自动推导，类型安全贯穿始终轻量化设计：体积比 Vuex 4 小 40%，运行时性能更优灵活的 Store 结构：每个 store 都是独立的模块，支持动态注册
2025-05-07 20:08:37
904
1
原创 Vuex使用指南：状态管理
在 Vue 应用中，状态指的是应用中的数据。用户登录状态购物车中的商品文章列表的分页信息状态管理就是对这些数据的创建、读取、更新和删除进行有效管理。
2025-05-05 21:19:56
891
1
原创 读懂 Vue3 路由：从入门到实战
路由可以简单理解为 “网址” 与 “页面内容（组件）” 之间的对应关系。在传统的多页应用中，每一个页面都是一个独立的 HTML 文件，通过超链接跳转时，浏览器会重新加载新的页面。而在单页应用里，整个应用只有一个 HTML 文件，通过路由来控制不同组件的显示与隐藏，从而模拟出页面跳转的效果。例如，当用户访问时，显示首页组件；访问时，显示关于我们的组件，这就是路由在起作用。
2025-05-02 21:58:54
1231
1
原创 Vue 3 单文件组件中 VCA 语法糖及核心特性详解
在 Vue.js 的开发世界里，单文件组件（Single File Components，简称 SFC）是构建复杂应用的基石。它将 HTML、CSS 和 JavaScript 代码封装在一个.vue文件中，极大地提高了代码的可维护性和复用性。本文将深入探讨单文件组件中几个重要特性：VCA 语法糖、computed、watch、props 与 emit，以及 provide 和 inject 的使用。
2025-04-30 20:36:02
636
1
原创 Vue 中的过渡效果与响应式数据：transition、transitiongroup、reactive 和 ref 详解
在 Vue 开发过程中，为应用添加过渡效果和处理响应式数据是提升用户体验和实现动态交互的关键。
2025-04-29 22:05:58
1314
原创 Swiper 在 Vue 中的使用指南
模板部分：使用swiper和swiper-slide组件创建轮播结构导入模块：导入 Swiper 核心组件、需要使用的模块（如分页、导航）以及相关样式配置参数：在 setup 函数中配置 Swiper 的模块和参数样式设置：为 Swiper 容器和滑动项设置基本样式
2025-04-28 19:39:21
1043
原创 【vue3】购物车实战：从状态管理到用户体验的全流程实现
Pinia 状态管理优势响应式：通过 ref 定义的 cartList 自动触发组件重新渲染，无需手动调用 forceUpdate。持久化：配置 persist: true 后，数据自动存储至 localStorage，刷新页面或重启浏览器后数据依然存在。模块化：将购物车相关的 state、action、computed 集中在 cartStore 中，方便后续扩展（如合并登录前后的购物车数据）。
2025-04-27 22:03:16
1020
原创 【vue3】图片预览组件实战：小图切换与放大镜效果实现
小图切换：利用响应式数据和事件监听，实现激活状态与大图同步更新。放大镜效果：借助简化鼠标位置追踪，通过边界计算和背景偏移实现放大交互。组件设计：分离模板、逻辑与样式，通过响应式数据驱动视图，提升可维护性。
2025-04-27 11:30:00
867
1
原创 手把手教你 Vue 父子组件通信（超通俗版）
儿子想告诉爸爸事情，就得喊爸爸注意 —— 子组件用$emit发信号，父组件用v-on// 明确告诉Vue：这个callback函数需要接收一个字符串参数，并且没有返回值}>();</script>父传子：爸爸用props给儿子送数据（Vue3 用声明，数据用ref变成响应式）。子传父：儿子用$emit（Vue2）或（Vue3）发信号，爸爸用@事件名监听。传函数注意：别用箭头函数导致上下文错乱，提前定义函数避免性能问题，复杂场景加类型定义和防抖节流优化。
2025-04-26 16:58:35
1546
原创 前端开发中列表无限加载功能的实现与优化
在如今的 Web 应用开发中，为了给用户提供更加流畅、高效的体验，许多应用都会采用列表无限加载的技术，比如常见的社交媒体动态列表、电商商品列表等。下面，我将结合实际项目，详细介绍列表无限加载功能的实现过程。
2025-04-26 11:30:00
627
原创 深入 Vue 核心：通信、生命周期与 API 的全面解析
在性能方面，选项式 API 在组件创建时需合并多个选项内容，大组件可能会有性能损耗；组合式 API 按需引入和执行代码，性能更优。在实际项目选型时，小项目或快速开发原型可选择选项式 API，因其简单易懂、开发速度快；大型项目，尤其是需要大量代码复用和处理复杂业务逻辑时，组合式 API 更具优势，能让代码更有条理、易于维护。
2025-04-25 16:00:00
749
原创 解决懒加载时底部图片 “一拥而上” 问题，优化页面加载体验
在懒加载场景下，一下子拉到底部导致所有图片同时触发懒加载，可能会造成瞬间加载压力过大，影响页面性能。
2025-04-25 12:00:00
337
原创 【Vue3 实战】插槽封装与懒加载
插槽让组件有了「可插拔」的能力，像搭积木一样组装页面懒加载让页面学会「按需呼吸」，节省资源的同时提升用户体验两者结合，实现了「结构统一」与「内容灵活」的完美平衡。
2025-04-24 18:19:24
896
1
原创 Vue 计算属性 VS 侦听器：从原理到性能的深度对比
computed 是 "数据的望远镜"，帮你高效观测衍生结果；watch 是 "数据的手术刀"，让你精准处理变化副作用。能用纯函数计算得到的结果，首选 computed，充分利用缓存提升性能涉及异步操作、副作用或深度监听，果断使用 watch，并做好防抖 / 粒度优化复杂场景可组合使用：通过 computed 拆分细粒度依赖，再用 watch 处理最终副作用。
2025-04-24 16:30:22
941
原创 前端开发核心知识详解：Vue2、JavaScript 与 CSS
是根据条件动态地创建或销毁 DOM 元素，当条件为假时，元素会从 DOM 树中彻底移除，初始渲染时若条件为假则不渲染。则专注于监听特定数据的变化，当监听的数据发生变化时，会执行对应的回调函数。它支持异步操作和深度监听，常用于处理数据变化后的副作用，比如在用户 ID 变化时，发起获取用户详情的请求。属性来控制元素的显示与隐藏，无论初始条件如何，元素都会被渲染到 DOM 中，只是通过样式来决定是否显示。它能在下次 DOM 更新循环结束之后执行延迟回调，确保在数据更新后，基于更新后的数据进行操作。
2025-04-22 20:06:38
1655
1
原创 前端面试常见问题深度解析
在前端开发的面试中，常常会涉及到数据结构、算法、框架使用、性能优化等多方面的知识。下面将对一系列我最近在前端面试中常见问题进行详细解答，希望能为正在准备面试或者想要深入学习前端技术的开发者提供帮助。常见的数据结构包括数组、链表、栈、队列、树（如二叉树）、图、哈希表等。链表本身不具备固定的先进先出或先进后出特性。它是一种线性数据结构，节点通过指针相连，方便进行插入和删除操作。若要实现先进先出，可以使用链表构建队列；若要实现先进后出，可以使用链表构建栈。链表插入和删除操作的时间复杂度通常为 O (1)，前提是已
2025-04-16 11:38:06
680
1
原创 解决 ECharts 图表无数据显示问题
当 ECharts 图表只有坐标轴但没有数据显示时，要从数据传递、数据格式、图表初始化时机和元素获取等方面进行检查。通过仔细排查，通常可以找到问题并解决。
2025-04-09 21:08:55
1318
原创 前端面试核心知识点整理：从 JavaScript 到 Vue 全解析
前端面试核心知识点整理：从 JavaScript 到 Vue 全解析。JavaScript 异步编程核心：Promise 与 async/await
2025-04-08 23:00:22
704
原创 JavaScript事件循环深度解析：从一道面试题看微任务与宏任务调度机制
理解事件循环机制是掌握JavaScript异步编程的核心。通过本文的实例分析，可以得出以下结论：微任务队列具有最高优先级，但需要在当前宏任务上下文中完全清空；嵌套的异步操作会创建新的任务队列项；合理的任务划分能有效提升程序性能。建议开发者在实际编码中通过等方法显式控制任务类型，确保程序行为符合预期。
2025-04-04 11:50:55
483
原创 超直白的JavaScript变量声明指南：别再纠结用哪个了！
📌 先const，再let，var直接丢垃圾桶📌 基本类型不能改，对象属性随便动📌 循环定时用let，配置信息用const
2025-03-28 17:24:02
195
原创 深度解析：并行与并发的本质区别，以及如何用线程、进程实现高效多任务
本文将通过通俗的比喻、代码示例和实战场景，彻底讲透它们的区别与联系，助你写出更高效的代码！，逻辑上看似“同时”，实际可能交替占用资源（如单核CPU通过时间片轮转运行多线程）。这两个概念常被混淆，但它们的设计目标、实现方式、适用场景截然不同。： 通过多进程实现并发（尤其在Python中绕过GIL限制）。： 在单核或多核CPU中，通过线程切换或并行执行实现并发。，依赖多核CPU、GPU或多机器等硬件支持。则是实现这两种任务处理模型的核心技术。：提高资源利用率，减少CPU空闲。：缩短任务总耗时，提升吞吐量。
2025-03-26 17:42:11
662
原创 MySQL绑定变量：揭秘高性能与安全并重的数据库优化利器
在数据库应用中，性能和安全是开发者永恒的追求。当面对高并发请求、重复性SQL操作或用户输入动态拼接的查询时，如何避免性能瓶颈和SQL注入风险？绑定变量（Prepared Statements） 正是解决这些问题的关键！本文将深入剖析MySQL绑定变量的核心原理、性能优势及实战应用，助你彻底掌握这一高效武器。绑定变量（Prepared Statements）是一种“预编译”的SQL执行机制：示例：二、绑定变量的核心优势1. 性能飙升：减少解析与编译开销 传统SQL执行流程： 每次执行需完整经历
2025-03-26 16:55:30
770
原创 揭秘ER图：数据库设计的可视化利器与实战技巧
在数据库设计中，如何将复杂的业务需求转化为清晰的数据结构？如何确保数据高效存储且避免冗余？实体-关系图（ER图）正是解决这些问题的核心工具。本文将从基础概念到实战应用，带你全面掌握ER图的设计精髓，避开常见陷阱，成为数据库设计的高手。，通过图形化表示系统中的实体、属性及其相互关系。用户 |——○ 订单。
2025-03-24 17:24:57
900
原创 弱网测试：全链路实战、高阶策略与自动化落地
在移动互联网时代，网络环境的不确定性成为用户体验的“隐形杀手”。弱网测试不仅是质量保障的必备环节，更是提升用户留存率和业务转化率的战略手段。四个维度，彻底解析弱网测试的完整方法论，并给出可直接复用的代码、配置脚本和实战案例。：模拟东南亚用户使用2G网络访问（带宽50kbps，延迟1000ms，丢包率20%）：在Ubuntu服务器上模拟5%丢包 + 200ms延迟 + 50ms抖动。：万人秒杀活动，网络拥塞导致API响应延迟飙升。
2025-03-22 17:50:45
1231
原创 安卓 vs iOS 文件系统深度解析：开放自由与封闭安全的终极博弈
安卓和iOS的差异远不止于界面和生态，它们的文件系统设计更是体现了两种截然不同的技术哲学。安卓的开放目录允许用户“为所欲为”，而iOS的沙盒机制则像一座密不透风的堡垒。本文将通过/system/data/proc/data/data/app//sdcard/MediaStoreDocuments/Library/Caches/tmp/
2025-03-22 16:15:19
1252
原创 软件测试面试通关秘籍：高频技术考点与实战技巧全解析
提供日志、截图、环境信息，并尝试稳定复现条件（如特定网络状态）。“如何向开发人员证明一个难以复现的Bug？“如何优化自动化测试脚本的执行效率？“如何分析性能测试结果中的瓶颈？“如何处理动态元素的定位问题？“如何测试一个登录功能？“如何测试一个搜索框？
2025-03-21 17:29:01
870
原创 Android自动化测试终极指南：从单元到性能全覆盖！
成为提升质量的核心手段。本文将手把手带你掌握Android项目中的六大测试工具，涵盖。在快节奏的移动开发中，应用的稳定性与用户体验直接决定成败。等核心场景，助你构建坚如磐石的应用！A：检查控件ID是否正确，或使用。
2025-03-20 22:15:00
983
原创 Android Monkey测试完全指南：从入门到实战
作为Android平台自带的压力测试工具，能够通过模拟海量随机用户操作（如点击、滑动、按键等），快速暴露应用的崩溃、ANR（无响应）等问题。本文将深入解析Monkey测试的核心用法，并提供实战案例与优化技巧。Monkey是Android系统自带的命令行工具，通过向设备发送伪随机事件流，对应用进行。建议将Monkey测试集成到CI/CD流程中，结合自动化脚本实现每日构建验证。在Android应用开发中，稳定性测试是确保用户体验的关键环节。：检查主线程耗时操作，使用异步或子线程优化。
2025-03-20 17:20:29
1262
原创 从安装到出图：手把手教你用Workbench绘制数据库设计图
可选择 “Typical”（典型安装）或 “Custom”（自定义安装），推荐典型安装，然后点击 “Next”。如果选择自定义安装，可以按需选择安装组件和安装路径。：安装完成后，会提示是否启动 MySQL Workbench，选择启动即可。，选择适合 Windows 系统的版本（Windows Installer MSI），点击 “Download” 按钮下载。：点击 “Install” 按钮开始安装，等待安装完成。：双击下载的安装包，弹出安装向导，点击 “Next”。
2025-03-15 14:04:16
919
原创 解锁数据库核心利器：索引、视图与事件的终极指南
索引是数据库中一种高效查找数据的结构，类似于书籍的目录。它通过预先排序和存储关键列的值，避免查询时的全表扫描。视图是一个虚拟表，通过SQL查询动态生成结果。它不存储数据，而是像“透镜”一样重新组织或过滤底层表的数据。事件是数据库中预定义的定时任务，可在指定时间或周期自动执行SQL操作，彻底告别手动执行重复任务。空间换时间（索引）抽象解耦（视图）自动化提效（事件）
2025-03-12 17:05:23
775
原创 通过配置代理解决跨域问题（Vue+SpringBoot项目为例）
代理的原理是将前端的请求发送到同源的后端服务器，由后端服务器再发送到目标服务器，并将响应返回给前端。这样前端代码实际上是与同源的后端服务器进行通信，而不是与目标服务器直接通信，从而避免了跨域问题。跨域问题常常出现在前端项目中，当浏览器中的前端代码尝试从不同的域名、端口或协议发出请求时，浏览器会因为同源策略而拒绝该请求。是由浏览器的同源策略引起的，同源策略是一种安全策略，用于防止一个网站访问其他网站的数据。具体来说，可以在前端项目的配置中设置代理规则，将某些请求路径转发到同源的后端服务器。
2025-01-29 16:08:11
356
原创 Vue | 搭建第一个Vue项目（安装node,vue-cli）
2.使用Vue CLI创建一个新的Vue项目。进入网站，下载对应版本的node.js。3.设置npm全局装包保存路径。出现版本号，则安装成功。
2025-01-22 20:15:00
412
前端-Vue-记事本-添加，清除，添加，展示功能
2025-01-18
大新闻springboot项目
2024-07-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人