阿珊和她的猫-CSDN博客

原创 2025，我的人生双系统：工作以 Deep Focus 攻坚，生活以 Recharge Time 续航

2025年复盘：在烟火与诗意间舒展生长✨ 这一年以温泉疗愈开启，在潮汕年味与广府节奏间自如切换。健身轨迹贯穿始终（瑜伽/普拉提/拳击/游泳），身体与心灵同步升级。用livehouse音乐、IMAX电影和密室探险滋养灵魂，以簪花、卡丁车等新体验拓展边界。在代码与UI设计之外，更珍视茶艺馆静坐、艾灸调理等慢时光。从带娃吃酒楼到独自K歌，从禅柔课到九价疫苗，每个具体而微的日常都成为生命经纬。2025，没有宏大叙事，只有认真泡汤、举铁、吃烧烤的每一刻，在热气腾腾的生活里长成更丰盈的自己。🌿

2025-12-30 06:30:00 1875 2

原创 AIGC 与 Agentic AI：生成式智能与代理式智能的技术分野与协同演进

AIGC与Agentic AI并非对立的技术路线，而是人工智能向“内容”与“行动”两个维度的延伸。前者构建数字世界的“素材库”后者搭建自动化的“执行引擎”两者共同推动AI从“工具”向“伙伴”的角色转变。随着技术的成熟，未来的智能系统将呈现“感知-生成-决策-执行”的全链条融合，而人类将更多聚焦于创造性思考与战略决策，在人与AI的协作中开启新的生产力革命。

2025-03-30 17:01:26 1287 1

原创 DeepSeek R1与V3：混合架构下的推理革命与效率破局

DeepSeek R1与V3的组合，标志着大模型从**“参数竞赛"转向"能力深耕”**的新阶段。当V3的高效架构遇见R1的推理革命，AI正在从"概率匹配机器"进化为"逻辑引擎"。随着开源生态的完善和硬件适配的深入，这场由DeepSeek开启的推理革命，或将重新定义AI在科研、开发、决策等领域的价值创造方式。

2025-03-28 00:08:27 1442 1

原创 Manus：通用智能体的架构革命与产业破局

Manus的意义远超一款产品的诞生，它标志着AI从"辅助工具"向"数字劳动力"的跃迁。当多智能体架构能驾驭复杂任务流程，当工具链整合形成行业专属解决方案，人工智能正在重塑人类的生产方式。正如其名字所喻，这场革命不仅需要"脑力"的突破，更依赖"手力"的深耕——在算法与工程的共振中，一个由智能体驱动的新时代正在到来。

2025-03-28 00:06:02 1612 1

原创 OWL与技术文档工程：语义时代的知识结构化革命

当OWL从实验室走向工程实践，其意义早已超越技术本身——它标志着人类知识管理从信息罗列迈向智慧互联。正如万维网之父蒂姆·伯纳斯-李所言：“语义网的终极目标，是让机器像人类一样理解世界。”而OWL，正是这场革命中不可或缺的数字基因。在技术文档领域，它正在书写的，不仅是更清晰的说明书，更是一个能自我进化的智能知识体。

2025-03-28 00:02:14 1176 1

原创 Claude 3.7：混合推理架构如何重塑AI编程范式

Claude 3.7的意义远超模型迭代本身，它标志着AI从“工具”向“协作者”的进化。当混合推理架构能同时驾驭快速响应与深度思考，当代码生成工具能理解业务逻辑的前世今生，软件开发正从“人力密集型”转向“智力密集型”。随着Gartner预测2026年75%企业将采用AI开发范式，Claude 3.7不仅是一个技术里程碑，更是开启智能开发时代的钥匙。

2025-03-28 00:00:30 1408 1

原创 MCP：一种用于将大型语言模型（LLM）与外部工具和数据源集成的开放协议

Figma-MCP 是连接设计与 AI 的桥梁，通过标准化协议实现设计流程的智能化。虽然目前仍有局限，但其在自动化、一致性和协作效率方面的潜力已逐步显现。随着 AI 技术的发展，MCP 有望成为设计团队不可或缺的工具。

2025-03-27 23:53:51 1633

原创 2024：在生活与 CSDN 中探寻成长密码

🤍前端开发工程师、技术日更博主、已过CET6🍨、23年度博客之星前端领域TOP1🕠高级专题作者、打造专栏🍚签约作者、上架课程。

2025-01-20 08:00:00 4122

原创腾讯云AI代码助手评测：智能编程新时代，你准备好了吗？

在本次开发案例中，我使用的是Windows 10操作系统，开发IDE为，编程语言为JavaScript，前端框架为Vue.js。腾讯云AI代码助手是基于混元代码大模型的辅助编码工具技术对话代码补全代码诊断代码优化它不仅支持100多种编程语言，还兼容和JetBrains等系列的主流IDE，为前端开发者提供全方位的支持，为开发之旅保驾护航。为了测试腾讯云AI代码助手，我们可以在中安装相应的插件。1️⃣打开，点击左侧的扩展图标2️⃣在搜索框中输入“” 或者 “腾讯云AI代码助手。

2024-08-01 08:00:00 2337 2

原创【前后端实战项目】带你从入门到实战全面掌握 uni-app

uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，具备"编写一次代码可发布到多个平台"的特点，大大的节省了开发成本，极速提升了开发效率。

2022-03-23 22:09:46 5171 4

原创【前后端实战项目】Vue.js 和 Egg.js 开发企业级健康管理项目

选择 vue-cli3 ，是为了让开发者能够开箱即用快速地进行应用开发而开发的，它们秉承的是思想，简单说就是能不配置的就不配置，你就按照我的方式来，也不要去争论这个好不好，快速进行业务开发才是正经事。它们不建议你去配置，但也不会拦着你去配置。

2020-10-16 15:05:44 3228 17

原创深入理解 Vuex 中的this.$store.dispatch方法

🤍 前端开发工程师（主业）、技术博主（副业）、已过CET6🍨🕠 牛客高级专题作者、在牛客打造高质量专栏🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程。

2020-04-24 22:22:29 106880 6

原创面试官：请你说一说vuex的五个属性，分别是什么，区别和用途说一下

今天面试的时候，有被问到vuex的五个属性，分别是什么，区别和用途说一下这个地方回答的不是很好，思路有点混乱所以就打算整理一下查了一下官网，关于vuex的五个属性还是有很多知识点的官网：https://vuex.vuejs.org/zh/guide/01 前言当我们用 Vue.js 开发一个中到大型的单页应用时，经常会遇到如下问题：如何让多个 Vue 组件共享状态？？V...

2020-04-08 22:14:50 17017 13

原创 Vue CLI：提升 Vue 项目开发效率与质量的多面手

摘要：Vue CLI作为Vue.js官方脚手架工具，显著提升了前端开发效率。它通过标准化模板（如vue create命令）实现一键项目初始化，内置热更新功能优化开发体验。集成ESLint保障代码规范，统一目录结构增强可维护性。丰富的插件系统（如Vue Router/Vuex）支持快速功能扩展，vue.config.js实现灵活配置。其标准化特性（依赖管理、Git兼容）极大便利团队协作，使开发者能专注于业务逻辑，是构建现代化Vue应用的优选方案。（150字）

2026-02-15 06:30:00 740

原创 Vue CLI：高效构建 Vue.js 项目的利器

摘要：Vue CLI 是 Vue.js 官方提供的项目脚手架工具，能快速初始化 Vue 项目并配置开发环境。本文介绍其安装方法（需 Node.js 14+）、两种创建方式（命令行vue create和图形界面vue ui），解析标准项目结构及关键配置文件（如vue.config.js）。详细说明开发命令npm run serve和构建命令npm run build的使用，并展示如何通过插件扩展功能。Vue CLI 通过标准化模板和灵活配置，显著提升开发效率，适合各类Vue项目开发。（149字）

2026-02-15 05:30:00 571

原创 Axios：现代 Web 开发中的 HTTP 客户端利器

Axios 是一个基于 Promise 的 HTTP 客户端，广泛应用于前端开发中与后端 API 的通信。它简化了 HTTP 请求的发送过程，支持 GET、POST 等多种方法，并自动处理 JSON 数据的转换。Axios 提供全局配置、拦截器、请求取消和详细的错误处理功能，极大提升了开发效率和应用性能。通过 Promise 的设计，Axios 避免了回调地狱问题，使异步请求代码更加简洁易维护。无论是处理数据请求、表单提交还是文件上传，Axios 都是一个强大而灵活的工具。

2026-02-14 06:30:00 433

原创使用 Axios 进行 HTTP 请求

Axios使用指南 Axios是一个强大的HTTP客户端，支持浏览器和Node.js。本文介绍Axios的核心功能：通过npm/yarn安装后，可使用get、post等HTTP方法发送请求，支持请求/响应拦截器进行全局逻辑处理，并能通过CancelToken或AbortController取消请求。配置对象允许设置请求参数，错误处理机制详细，还可创建独立实例复用配置。Axios简化了HTTP通信，是前端开发的利器。

2026-02-14 05:30:00 671

原创 Vuex 的核心作用深度解析：构建高效可维护的 Vue 应用状态管理体系

Vuex在Vue.js应用开发中发挥着核心作用，通过集中式状态管理解决组件间复杂的状态共享问题。其核心优势包括：1）建立单一数据源，提升代码可维护性；2）通过Mutation确保状态变化的可预测性；3）利用Action处理异步操作，实现逻辑解耦；4）简化跨组件通信；5）支持模块化管理，适应大型项目需求。Vuex的这些特性使其成为构建可维护、可扩展Vue应用的必备工具，有效解决了传统状态管理方式在大型应用中的局限性，为开发者提供了规范化的状态管理方案。

2026-02-13 06:30:00 1467

原创 Vuex：Vue.js 应用的高效状态管理方案

摘要 Vuex是Vue.js的状态管理库，用于集中管理组件间共享的状态。它包含五个核心概念：State（状态存储）、Action（异步操作）、Mutation（状态修改）、Getter（派生状态）和Module（模块化）。安装Vuex后，通过创建Store实例并在Vue中注入，即可在组件中访问状态、提交变更或触发动作。使用Vuex时需注意：Mutation必须是同步的，Action处理异步逻辑，Getter用于计算派生状态，模块化适用于大型项目。合理使用Vuex可使状态管理更清晰、可维护性更高。

2026-02-13 05:30:00 1460

原创 Vue Router 的使用指南

本文详细介绍了Vue Router的安装配置与核心功能。主要内容包括：1）通过npm/yarn安装Vue Router 4；2）创建路由实例并配置基本路由；3）使用router-view和router-link实现路由切换；4）动态路由匹配与参数获取；5）嵌套路由的实现方式；6）全局/路由独享/组件内三种路由守卫的使用；7）编程式导航方法；8）路由懒加载优化性能。此外还提供了路由不更新的常见解决方案，帮助开发者快速掌握Vue Router的核心功能。

2026-02-12 06:30:00 1528

原创 Vue Router 的两种模式：`history` 模式与 `hash` 模式

Vue Router提供hash和history两种路由模式，各有特点：hash模式通过#符号实现路由，兼容性好且无需服务器配置，但URL不美观且SEO不友好；history模式利用浏览器API实现简洁URL，对SEO更优但需后端支持。选择依据项目需求：小型或快速开发项目适合hash模式，大型或SEO敏感项目推荐history模式。使用history模式需配置Vue Router的createWebHistory方法并设置服务器路由转发。根据项目规模、SEO需求和后端支持情况合理选择路由模式。

2026-02-12 05:30:00 1597

原创 JSX 在 Vue 开发中的适配场景深度解析

摘要： JSX 在 Vue 开发中虽非主流，但在特定场景下优势显著。本文分析 JSX 的适用场景：复杂逻辑渲染：JSX 简化动态条件与数据处理的代码结构；函数式复用：支持逻辑抽象为可复用函数组件；跨框架协作：降低 Vue 与 React 混合开发的技术切换成本；高性能需求：精准控制渲染范围以优化性能。需权衡团队熟悉度、项目规模及工具兼容性，合理选择 JSX 或模板语法以实现开发效率与可维护性的平衡。

2026-02-11 06:30:00 283

原创在 Vue 中使用 JSX 开发：实践指南与要点解析

摘要 JSX 作为 JavaScript 的语法扩展，在 Vue 项目中同样适用。通过配置 Babel 插件 @vue/babel-plugin-jsx，开发者可以在 Vue 中使用 JSX 语法编写组件。JSX 提供了更灵活的 UI 描述方式，支持数据绑定、事件处理和子组件引用。虽然语法与 React 类似，但需注意 Vue 特有的指令和生命周期差异。合理使用 JSX 能提升开发效率，但需关注性能优化。随着 Vue 生态发展，JSX 将成为 Vue 开发的重要选择之一。

2026-02-11 05:30:00 383

原创 Vue 函数组件的定义与使用

Vue 3函数组件是一种轻量级组件形式，适用于无状态的展示性组件。本文介绍了三种定义方式：基本函数形式、使用setup函数和JSX语法。函数组件具有无状态、高性能和代码简洁的特点，适合用于简单展示、性能优化需求或组件包装场景。但需要注意其限制：不支持状态管理、生命周期钩子和实例访问。通过合理使用函数组件，可以优化Vue应用的性能和代码结构。

2026-02-10 06:30:00 1088

原创 Vue 中函数组件与普通组件的区别

Vue 3 引入了函数组件（Functional Components），为开发者提供了更灵活的组件定义方式。函数组件与传统的普通组件在定义方式、性能表现、功能特性等方面存在显著差异。本文将详细对比函数组件和普通组件的区别，并探讨它们的适用场景。

2026-02-10 05:30:00 737

原创 Vue3 组合式 API：构建高效、灵活的 Vue 应用架构

摘要 Vue3 的组合式 API（Composable API）通过函数式编程重构了组件逻辑组织方式，解决了传统选项式 API 在复杂场景下的代码耦合问题。其核心在于以 ref/reactive 实现响应式数据管理，通过函数封装实现逻辑复用（如 useMousePosition），并整合生命周期钩子（onMounted 等）。优势包括提升代码可读性、支持细粒度性能优化（如精准 watch 监听），以及便于跨组件逻辑复用（如 useFetch）。适用于复杂业务拆分、跨组件复用及渐进式迁移，标志着 Vue 开发

2026-02-09 06:30:00 997 1

原创深入理解 Vue 列表渲染中 `key` 属性的作用

本文深入探讨了Vue列表渲染中key属性的关键作用。key作为唯一标识符，能优化Diff算法性能，准确追踪元素变化，保持列表项状态稳定。文章分析了其工作原理，通过实例说明合理使用key可避免渲染错误，提升大规模列表性能。同时指出使用注意事项：必须采用唯一值（如数据ID），避免使用随机值或数组索引。正确运用key属性能显著提高Vue应用的渲染效率和稳定性，是前端开发中的最佳实践。

2026-02-09 05:30:00 990

原创简易实现 Vue 的 `nextTick` 功能

本文介绍了 Vue.js 中 nextTick 的核心原理与简易实现方法。nextTick 用于确保回调在 DOM 更新完成后执行，其核心原理包括异步执行、DOM 更新确认和性能优化。文章提供了三种实现方式：基于 Promise 的微任务队列、setTimeout 的宏任务队列，以及利用 MutationObserver 监听 DOM 变化，并最终给出了一个综合实现方案。通过测试用例验证了简易版 nextTick 的有效性，帮助开发者深入理解这一重要机制的工作原理。

2026-02-08 06:30:00 740

原创为什么在某些情况下 `nextTick` 似乎无效？

Vue.js的nextTick方法用于在DOM更新后执行回调，但有时可能失效。本文分析了三种常见原因：错误使用场景：在非Vue管理的DOM或非响应式数据更新后使用nextTick，导致回调无法捕获正确状态；异步更新复杂性：多次数据更新被合并处理，或嵌套调用nextTick可能导致回调延迟执行；浏览器渲染机制：回调执行时机与浏览器渲染阶段不一致，可能无法获取最新DOM状态。正确使用nextTick需要理解其异步特性和Vue的响应式机制。

2026-02-08 05:30:00 770

原创 Vue 关键生命周期的应用场景剖析

摘要 Vue 的生命周期钩子函数贯穿组件从创建到销毁的整个过程，为开发者提供了在特定阶段执行代码的能力。本文详细解析了 Vue 关键生命周期阶段（包括 beforeCreate/created、beforeMount/mounted 和 beforeUpdate/updated）的特点和应用场景。通过实际代码示例，展示了如何在数据初始化、异步请求、DOM 操作等场景中合理运用这些钩子函数，帮助开发者编写更高效、可维护的 Vue 应用。理解这些生命周期阶段对于优化组件性能和解决特定开发问题具有重要意义。

2026-02-07 06:30:00 1524

原创 Vue 中 nextTick 的作用与底层实现剖析

摘要： nextTick 是 Vue 开发中的关键工具，用于在 DOM 更新后执行代码，解决异步更新导致的访问问题。其核心原理是通过异步任务队列（如 Promise、MutationObserver、setImmediate 或 setTimeout）确保回调在 DOM 更新完成后触发。典型场景包括获取更新后的 DOM 状态或执行后续操作。理解 nextTick 的作用与实现机制，能帮助开发者更高效地处理 Vue 的异步更新逻辑。

2026-02-07 05:30:00 1509

原创 Vue 中 `v-if` 和 `v-show` 的底层原理解析

本文深入解析了Vue.js中v-if和v-show的底层原理与区别。v-if通过条件渲染实现，会销毁/重建虚拟DOM节点，切换成本高，适合不频繁变化的场景；v-show通过修改CSS的display属性控制显示，切换成本低，适合频繁切换的场景。文章从响应式绑定、虚拟DOM操作等方面对比了两者的实现机制，并给出了适用场景建议：频繁切换用v-show，需彻底移除元素时用v-if。帮助开发者根据实际需求合理选择指令，优化性能表现。

2026-02-06 06:30:00 797

原创 CSS 隐藏元素的多种方式

本文介绍了CSS隐藏元素的五种常见方法：display: none彻底隐藏元素且不占空间；visibility: hidden保留布局空间；opacity: 0支持渐隐动画；position: absolute移出可视区域；clip-path实现复杂形状隐藏。分析了各方法的性能差异和适用场景，建议根据需求选择：需要完全隐藏用display: none，保留空间用visibility或opacity，辅助内容用定位法。帮助开发者合理选择隐藏方式，优化页面性能与用户体验。

2026-02-06 05:30:00 643

原创 CSS属性对重绘与重排的影响深度解析

摘要：本文解析了CSS属性如何触发重绘（Repaint）与重排（Reflow），两类操作对网页性能的影响差异显著。重排由几何属性（如width、margin、position）引发，需重新计算布局，开销较大；重绘则因视觉属性（如color、background、shadow）变化触发，仅更新外观。优化建议包括：避免强制同步布局、优先使用transform/opacity实现动画，以减少性能损耗。理解这些机制有助于开发者编写高效CSS，提升页面渲染性能。（字数：149）

2026-02-05 06:30:00 852

原创给标签设置CSS属性：重绘与重排的触发机制解析

本文深入解析CSS属性设置与重绘(Repaint)、重排(Reflow)的关系。重排涉及几何属性改变(如width/position)，代价较高；重绘仅影响外观(如color/background)，代价较小。文章详细列举了触发两种机制的常见属性，并揭示了浏览器的渲染队列机制。最后提出优化策略：减少频繁修改、使用requestAnimationFrame、合理应用will-change属性以及避免table布局。掌握这些原理可有效提升页面性能，优化用户体验。

2026-02-05 05:30:00 1638

原创 Vue2 与 Vue3 的 Diff 算法：原理、差异与应用

本文对比分析了Vue2和Vue3的Diff算法。Vue2采用双指针和同层比较策略，在大规模列表处理上存在性能瓶颈；Vue3引入最长递增子序列算法，利用节点key优化比较过程，显著提升了更新效率。建议小规模应用可使用Vue2，而大规模列表场景推荐采用Vue3，并为节点提供唯一key以发挥算法优势。两种算法各有适用场景，开发者需根据项目需求选择合适版本。

2026-02-04 06:30:00 773

原创 Vue2 与 Vue3 响应式原理深度剖析

Vue2与Vue3响应式原理对比分析 Vue2采用Object.defineProperty()实现响应式，通过getter/setter劫持属性访问，配合发布-订阅模式实现数据视图同步。但存在无法检测新增/删除属性、数组操作支持有限等局限。Vue3改用ES6 Proxy实现，可拦截对象所有操作，解决了Vue2的局限性，性能更优且API更简洁。Vue2兼容性更好，Vue3则提供了更完善的响应式支持。开发者需根据项目需求和浏览器兼容性选择版本，Vue3在大型应用中优势明显，而Vue2更适合兼容性要求高的场景。

2026-02-04 05:30:00 1991

原创 Vue 中 data 为何是函数而非对象：深入解析其设计原理

Vue.js中data必须定义为函数而非对象的原因在于：1）避免组件实例间共享同一数据对象导致状态污染；2）确保每个实例拥有独立响应式数据。函数形式让Vue在实例化时生成独立数据副本，支持动态初始化（如基于props设置初始值），同时优化性能。这是Vue响应式系统的核心设计，开发者应始终以函数形式声明data，并注意避免在函数内过早访问实例属性。遵循该原则可保证组件数据隔离性和应用稳定性。

2026-02-03 06:30:00 830

原创 Vue 2 与 Vue 3 中父子组件及兄弟组件的通信方式

Vue.js 组件通信方式总结本文详细介绍了 Vue 2 和 Vue 3 中父子组件及兄弟组件的通信方式：父子组件通信父传子：使用 props 传递数据（单向数据流） Vue 2/Vue 3 实现方式基本一致子传父：使用 $emit 触发事件通过 ref 直接访问子组件实例两种框架实现方式相似兄弟组件通信通过父组件中转（使用 props + $emit）使用 Event Bus（Vue 2 通过 Vue 实例，Vue 3 需引入 mitt 等库）使用 Vuex/Pinia 状态管理（

2026-02-03 05:30:00 1770

原创深入剖析 Vue 中 computed 和 watch 的区别

摘要 Vue.js中的computed和watch是处理数据变化的两种核心机制。computed作为计算属性，基于依赖数据自动计算并缓存结果，适合处理同步数据转换；watch作为监听器，在数据变化时执行回调函数，适合处理异步操作和复杂逻辑。二者主要区别在于：1）computed具有缓存机制而watch每次都会执行；2）computed适用于派生数据，watch适用于响应变化；3）computed代码更简洁，watch更适合复杂逻辑。开发者应根据具体场景合理选择，computed优化性能，watch处理副作用

2026-02-02 06:30:00 1331

一个月学会JavaScript.pdf

空空如也