Posts

Vue模板引用（Template Refs）通过ref属性实现，用于直接访问DOM元素或子组件实例。Vue3.5+推荐useTemplateRef，旧版用ref变量；支持v-for数组引用、函数绑定及子组件引用（子组件需defineExpose暴露）。适用于自动聚焦、第三方库初始化等场景，需注意挂载后访问及子组件暴露要求。

Vue 3中watch需显式声明监听源（支持新旧值），watchEffect自动收集依赖（立即执行）。避坑：深度监听用精准属性，内存泄漏用stop/onCleanup，高频操作加防抖。调试用Vue DevTools，可结合日志优化。

Vue3侦听器分组件内与Pinia应用：组件内watch需显式依赖，获新旧值，支持深度/立即执行；watchEffect自动追踪依赖，立即执行。Pinia可监听store状态（单个/多个/整个store），如表单数据同步。含深度监听、立即执行及常见报错解决。

Vue 3中，watch需手动指定监听源，惰性执行且可获取新旧值，支持嵌套监听、深度监听及立即执行；watchEffect自动收集依赖，立即执行（无新旧值），支持副作用清理与执行时机调整。选型：特定源或需新旧值用watch，多依赖或自动执行用watchEffect。

Vue 3侦听器需暂停恢复（手动停止用unwatch()）避免资源消耗，异步创建的需手动管理防内存泄漏。副作用用onCleanup+AbortController取消旧请求避免竞态。应用于表单自动保存、条件侦听等场景。

Vue 3 watchEffect是自动追踪响应式依赖的API，无需手动指定数据源，初始化时立即执行，追踪回调中所有响应式依赖。支持副作用清理（通过onCleanup）、执行时机控制（pre/post/sync），适用于数据请求、DOM操作等多依赖场景。可通过返回值停止监听，结合ref/reactive使用，需注意性能优化。