vue 不会自动清理 addeventlistener 手动绑定的 dom 事件监听器，需在 onunmounted 中显式调用 removeeventlistener 配对移除；vue 自管事件（如 @click）和 v-on 绑定则自动清理。
Vue.js 不会自动帮你清理通过 addEventListener 手动绑定的 DOM 事件监听器，这部分必须由开发者显式处理；而 Vue 自己管理的事件（如 @click）会在卸载时自动解绑，无需干预。
手动添加的事件监听器必须配对移除
你在 mounted 或 onMounted 中用 addEventListener 绑定到 window、document 或其他全局节点上的监听器，不会随组件卸载自动消失。若不清理，它们会持续触发，并持有组件内闭包变量，导致内存泄漏。
- 每次
addEventListener都要确保后续有对应的removeEventListener，且传入的回调函数必须是同一个引用（不能用箭头函数或内联函数） - 推荐把 handler 定义为具名函数或用
ref缓存，方便在卸载时精准移除 - 常见场景包括：窗口大小变化（
resize）、键盘事件（keydown）、点击外部关闭（click监听 document）等
清理时机统一放在 onUnmounted
这是组合式 API 中最标准、最可靠的清理入口，执行时机明确：子组件先于父组件触发，DOM 尚未移除但 vnode 已退出树结构，适合做资源释放。
- 定时器、WebSocket 连接、IntersectionObserver、ResizeObserver 等都应在
onUnmounted中关闭或断开 - 第三方库实例（如 Chart.js、Mapbox）需调用其
destroy()或remove()方法，否则内部持有的 DOM 引用和事件监听仍存在 - 可配合 guard 判断实例是否存在，避免重复调用报错
用组合式函数封装事件绑定更安全
直接写 addEventListener 容易遗漏清理或引用不一致。推荐封装成可复用的 useEventListener，内部自动注册并自动在 onUnmounted 解绑。
- 函数接收目标元素、事件类型、回调，返回一个用于提前解绑的
remove方法 - 内部使用
onUnmounted做兜底清理，兼顾手动控制与自动保障 - 避免在
watch或watchEffect中反复绑定却忘记解绑——这类逻辑也应纳入生命周期闭环
Vue 内部事件无需手动清理
模板中写的 @click、@input 等，以及通过 v-on 绑定的事件，均由 Vue 渲染器统一管理。在 patchElement 更新阶段，它会比对新旧 props，自动卸载旧监听、挂载新监听；组件卸载时也会一并清理，开发者不用操心。
- 同理，
$on/$emit的自定义事件，若用的是 Vue 实例上的事件总线，需手动$off；但 Composition API 中推荐用mitt或events库，并在onUnmounted中调用clearAll或销毁实例 - 注意区分：原生 DOM 事件要自己管，Vue 封装层事件由框架管
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
