A孙果果-优快云博客

原创快速学习一门新知识

这是拉开学习效率差距的关键。拿到资料后，先别逐字阅读。快速学习一门新知识，核心不在于“输入”的速度，而在于“，必须完成一次完整的实战，否则遗忘率高达70%。真正的高手不是读得快，而是。

2026-08-27 17:26:58 221

原创无渲染组件和组合式函数

它指的是组件本身不输出任何DOM节点，只负责封装状态和逻辑，通过**作用域插槽（Scoped Slots）**将内部数据和方法暴露给父组件，由父组件决定UI长什么样。

2026-08-06 15:49:25 224

浏览器（http://localhost:8080）↓ 请求 /api/xxx (同源，无跨域)Node 代理服务器 (http://localhost:8080)↓ 转发请求 (服务器之间无跨域限制)目标后端服务器 (https://api.xxx.com)↓ 返回数据Node 代理服务器↓ 返回数据浏览器（成功拿到数据）这份指南已经帮你避开了file://协议和路径不对的坑，按步骤操作即可彻底解决本地开发跨域问题。祝编码顺利！🚀。

2026-07-09 15:41:03 180

原创 vue中环境变量文件

在 Vite 项目中，只有以VITE_开头的变量才会被客户端（你的 Vue 组件和页面）正常读取。变量名作用说明示例值后端接口的基础地址(开发)(生产)页面标题或应用名称我的管理系统当前运行环境标识production文件上传专用服务器地址特别注意：如果你在中需要使用变量（而非前端页面），则不受VITE_前缀限制，可以直接读取所有变量。在项目根目录（即.env：通用配置，无论什么环境都会加载（优先级最低）。：开发环境加载（执行时生效）。：生产环境加载（执行时生效）。文件内容。

2026-07-01 15:52:29 263

原创为什么重新赋值不能用reactive要使用ref

reactive：只能改属性），不能换对象ref：既能改属性），也能换对象所以，当你的数据未来大概率需要整体替换（比如接口返回的新对象）时，请毫不犹豫地使用ref.value。如果数据结构固定且不需要整体替换（如表单校验对象），用reactive会更省代码（不用到处写.value。

2026-06-30 11:49:10 397

原创异步组件 + 路由懒加载综合 Demo

使用方式优点适用场景路由配置中使用可配置全局统一的 loading/error 状态页面级组件需要优雅的加载反馈组件内部使用粒度更细，可针对某一块内容单独控制复杂页面中的局部模块（如图表、编辑器等）直接用简单，无需额外配置对加载状态要求不高，追求极致简洁。

2026-06-29 18:32:57 274 1

原创路径参数（Params）和查询参数（Query）的展示方式和获取方式

path: '/user/:userId/post/:postId', // 定义两个参数。

2026-06-26 11:36:30 361

原创使用 `＜Teleport＞` 实现全局模态框（Vue 3）

，从而突破组件层级限制，非常适合实现模态框、全局提示、下拉菜单等需要脱离父容器样式的场景。是 Vue 3 内置组件，可以将组件模板的一部分。到 DOM 中任意位置（如。

2026-06-25 16:50:43 237

原创实现 Tab 切换面板（动态组件）Demo

非常适合实现 Tab 切换面板——根据当前选中的 Tab，动态渲染对应的组件，且组件实例会被。，包含 Tab 导航和内容区域，并演示了组件切换、状态保持和 Props 传递。

2026-06-25 15:28:30 286

原创实现支持作用域插槽的通用数据表格组件

单元格内容。

2026-06-24 18:07:35 251

原创 watch中为什么不能直接侦听响应式对象的属性

方式类型能侦测变化？原因具体值（数字/字符串等）❌失去响应式依赖，只拿到快照getter 函数✅内部追踪.count的访问，建立依赖响应式对象✅直接侦听整个对象ref 对象✅ref 本身是响应式引用要侦听响应式对象的属性，必须用函数返回它；直接传值，Vue 不认得。这是 Vue 3 响应式 API 的一个设计选择，目的在于明确追踪边界，避免性能浪费和意外行为。

2026-05-28 14:48:40 323 1

原创 Access-Control-Allow-Origin 详解

是HTTP响应头中的一个字段，用于。→ 这会导致安全漏洞！

2025-10-27 13:26:10 985

原创 chmod +x

命令含义使用场景chmod +x 文件名让文件具有可执行权限当你想要运行一个自己编写或下载的脚本/程序时，必须的一步。

2025-08-27 10:04:38 1894

原创 Vuex 核心知识点总结

理解 Vuex 的核心机制和最佳实践，能够帮助构建可维护性强、状态可预测的 Vue 应用。

2025-04-29 11:18:51 1100

原创 Vue 生命周期钩子总结

Vue 组件的生命周期钩子允许在组件不同阶段执行自定义逻辑。理解生命周期钩子的执行顺序和适用场景，有助于编写高效、可维护的 Vue 组件。Vue3 保留了 Vue2 的生命周期钩子，但命名略有调整，并新增了。函数作为组合式 API 的入口。

2025-04-28 17:57:04 982

原创 `==` 和 `===` 的隐式转换规则总结

通过理解隐式转换规则，可以有效避免代码中的潜在问题，写出更健壮的 JavaScript 程序。：以下代码的输出是什么？：以下代码的输出是什么？

2025-04-27 16:08:13 590

原创 Set、Map、WeakSet、WeakMap 知识点总结及对比

【代码】Set、Map、WeakSet、WeakMap 知识点总结及对比。

2025-04-27 10:21:50 406

原创函数柯里化的应用场景及示例

函数柯里化通过将多参数函数转换为单参数链式调用的形式，增强了函数的灵活性和复用性。函数柯里化通过灵活的参数管理和逻辑拆分，显著提升了代码的复用性和可维护性，尤其适合函数式编程和复杂业务逻辑的场景。：避免重复传递相同的基地址参数，简化调用逻辑。：需要多次调用同一函数，且部分参数固定。：通过链式调用实现清晰的函数组合逻辑。：参数需要分阶段收集，最后统一处理。：通过预定义级别参数，减少重复代码。：隐藏复杂参数，提供简洁的调用接口。：根据不同条件生成不同逻辑的函数。：统一不同接口的参数格式。：为事件回调预置参数。

2025-04-27 09:02:29 587

原创发布-订阅模式应用场景及示例说明

发布-订阅模式通过事件中心解耦组件间的直接依赖，适用于需要灵活、动态通信的场景。通过发布-订阅模式，可以显著提升代码的可维护性和扩展性，尤其适合复杂系统中的事件驱动架构设计。：多个独立组件需要响应同一事件（如用户登录、数据更新）。：DOM 事件（如点击、滚动）本质上是发布-订阅模式。：允许第三方插件监听核心系统的事件，扩展功能。：服务间通过事件通信，避免直接 API 调用。：游戏对象的状态变化触发多系统响应。：多个异步任务完成后触发后续操作。：跨模块通信，避免直接依赖。

2025-04-26 07:27:03 1299

原创 Object.defineProperty 与 Proxy解析

【代码】Object.defineProperty 与 Proxy解析。

2025-04-25 16:41:53 638

原创 JavaScript 实现继承及 Class 本质详解

是语法糖，底层仍基于原型链和构造函数。：避免组合继承中重复调用父类构造函数。：在子类构造函数中调用父类构造函数。：结合原型链继承和构造函数继承。：基于现有对象创建新对象（类似。：在原型式继承基础上增强对象。：子类的原型指向父类的实例。

2025-04-24 19:32:10 782

原创 ES6 模块化与 CommonJS 的核心概念解析

掌握 ES6 模块化与 CommonJS 的核心差异，能帮助你在不同场景下合理选择模块系统，优化代码结构并避免常见陷阱（如循环依赖、内存泄漏）。掌握 ES6 模块化与 CommonJS 的核心差异，能帮助你在不同场景下合理选择模块系统，优化代码结构并避免常见陷阱（如循环依赖、内存泄漏）。：导出的是值的引用，导入和导出指向同一内存地址。：导出的是值的引用，导入和导出指向同一内存地址。：导出的是值的拷贝，后续修改不影响原始值。：导出的是值的拷贝，后续修改不影响原始值。：静态加载可能导致未初始化引用错误。

2025-04-24 18:15:00 847

原创在 JavaScript 中，`call`、`bind` 和 `apply`区别

在 JavaScript 中，callbind和apply是函数对象的方法，用于显式绑定函数的this指向。

2025-04-23 20:02:02 1025

原创 JavaScript 数据类型与隐式转换详解

隐式转换规则优先拼接字符串，其他运算符优先转为数字。对象通过valueOf()和toString()转换为原始值。宽松相等（==）会触发复杂转换逻辑。最佳实践使用===代替==避免意外转换。复杂运算时显式转换类型（如Number()String()注意NaNnullundefined的特殊行为。示例代码总结// "12"// 3// true（空数组 → "" → 0）// true（非空字符串为真）

2025-04-09 14:00:07 587

原创 Vue3 和 Vue2区别

Vue3 在性能、代码组织和开发体验上均有显著提升，适合新项目或复杂度高的场景。对于老项目，建议评估迁移成本后逐步升级。

2025-04-04 11:06:50 1462

原创总结Webpack相关内容

入口（Entry）指定打包的起点，Webpack 从这里开始构建依赖图。输出（Output）定义打包后文件的输出位置和命名规则。示例：output: {加载器（Loaders）处理非 JavaScript 文件（如 CSS、图片），需在中配置。示例：使用 Babel 转换 ES6+ 语法：module: {rules: [插件（Plugins）扩展 Webpack 功能（如生成 HTML 模板、提取 CSS）。示例：自动生成index.html模式（Mode）

2025-04-01 09:26:59 649