随笔分类 -  vue

Vue 3 核心进阶：掌握 Props 传参及 TypeScript 最佳实践
摘要：在 Vue 3 的组件化开发中，props 是实现父子组件解耦、数据流动的核心机制。本文将带你从基础语法到 TypeScript 高级校验，全面掌握 props 的使用。 一、 Props 的基本定义 在 <script setup> 语法糖中，我们使用 defineProps 宏来声明组件接收的属 阅读全文
posted @ 2026-01-04 03:46 雨中遐想 阅读(19) 评论(0) 推荐(0)
Vue 3 核心进阶：深度解析计算属性 (Computed)
摘要：在 Vue 3 的 Composition API 中，computed 是最常用且最强大的响应式工具之一。它不仅能简化模板逻辑，还能通过缓存机制极大地优化应用性能。 一、 什么是计算属性？ 计算属性（Computed Properties）本质上是一个响应式的派生值。它可以基于一个或多个响应式引用 阅读全文
posted @ 2026-01-04 01:03 雨中遐想 阅读(52) 评论(0) 推荐(0)
Vue 3 实战技巧：彻底搞懂模板引用 ref 属性
摘要：在 Vue 的声明式编程世界里，我们大部分时间都在操作数据。但总有一些时刻，我们需要“越级”直接去碰一下真实的 DOM 元素，或者去调用子组件里的方法。这时候，ref 属性就是你的“直连电线”。 一、 什么是模板引用（Ref）？ 简单来说，ref 是 Vue 提供的一个特殊属性，允许我们在模板（HT 阅读全文
posted @ 2026-01-03 03:25 雨中遐想 阅读(42) 评论(0) 推荐(0)
Vue 3 watchEffect 告别繁琐：watchEffect 的优雅之道
摘要：在上一篇中我们聊透了 watch 的用法，但 Vue 3 还提供了另一个更“聪明”的侦听工具：watchEffect。如果说 watch 是手动档，需要你明确指定观察对象，那么 watchEffect 就是自动档，它能自动追踪代码中的响应式依赖。 本文将带你深入理解 watchEffect 的运行机 阅读全文
posted @ 2026-01-03 00:17 雨中遐想 阅读(26) 评论(0) 推荐(0)
Vue 3 Watch 进阶指南：从基础进阶到 Vue 3.5 新特性全掌握
摘要：在 Vue 3 开发中，watch 是我们处理副作用（如异步请求、DOM 操作、数据同步）的核心武器。随着 Vue 3.5 版本的发布，侦听器又迎来了一些非常实用的更新。本文将带你从零开始，深度拆解 watch 的所有高阶用法与避坑指南。 一、 Watch 的核心定义 watch 的本质是懒执行的副 阅读全文
posted @ 2026-01-02 23:35 雨中遐想 阅读(16) 评论(0) 推荐(0)
Vue 3 响应式进阶：掌握 toRef 与 toRefs，告别解构陷阱
摘要：前言 在 Vue 3 的组合式 API 中，reactive 为我们提供了强大的深度响应式能力。然而，很多开发者在享受解构（Destructuring）带来的代码简洁感时，往往会掉进一个“响应式丢失”的陷阱。 为了解决这个问题，Vue 3 官方提供了 toRef 和 toRefs 两个工具函数。今天 阅读全文
posted @ 2026-01-02 21:20 雨中遐想 阅读(43) 评论(0) 推荐(0)
Vue 3 深度解析：Ref vs Reactive 到底怎么选？
摘要：Vue 3 深度解析：Ref vs Reactive 到底怎么选？ 在 Vue 3 的组合式 API 中，ref 和 reactive 是构建响应式数据的基石。虽然它们都能驱动视图更新，但在实际开发中，选择不当往往会引发“数据变了视图没动”的坑。 本文将通过多维度对比，带你彻底掌握这两个 API。 阅读全文
posted @ 2026-01-02 14:26 雨中遐想 阅读(31) 评论(0) 推荐(0)
Vue 3.3+通过defineOptions来定义组件名字
摘要：在vue3中，因为使用了setup语法，在script标签中不能通过export直接定义组件的名字。下面提供两种方式来设置组件的名字。 方式一 使用defineOptions 如果是vue3.3+，可以直接在script中使用defineOptions来定义组件名字。 <script setup> 阅读全文
posted @ 2025-12-29 01:07 雨中遐想 阅读(24) 评论(0) 推荐(0)