Vue事件不生效主因是事件名大小写敏感及格式转换错误：emit必须全小写中划线，驼峰名会自动转短横线但需合法；仅限直接父子通信；setup中禁用this.$emit；需用console验证是否触发。
父组件没反应，大概率不是逻辑写错了，而是事件名“看起来对、其实错”。Vue 对 emit 事件名是大小写敏感的，而且会自动做格式转换——这个细节不注意，90% 的“不生效”问题就出在这儿。
事件名必须全小写 + 中划线分隔
Vue 会把驼峰命名（如 updateValue）自动转成短横线格式（update-value）去匹配监听器。但前提是：子组件 emit 时传的字符串本身得是合法的小写形式。
- ✅ 正确写法：
emit('submit-form')→ 父组件用@submit-form="handler" - ✅ 也正确：
emit('changeValue')→ Vue 自动转为change-value，父组件监听@change-value - ❌ 错误写法：
emit('ChangeValue')或emit('updateValue')→ 转换后变成changevalue或updatevalue（全连在一起），父组件监听@change-value就完全对不上
检查父子组件是否真在“一层关系”里
emit 只在**直接父子**间有效。如果子组件其实是孙组件（比如 A → B → C，你在 C 里 emit，想让 A 监听），那肯定收不到。
- 确认模板中父组件是否真的引用了该子组件，而不是通过插槽、动态组件或 Teleport 间接渲染
- 避免在
v-if为 false 时提前调用 emit；也别在组件onBeforeUnmount后还试图触发 - 弹窗类组件要特别注意：如果先调了
close()再 emit，可能 DOM 已卸载，事件就丢了
setup 里别用 this.$emit
Vue3 的 setup 函数中，this 是 undefined。沿用 Vue2 写法会静默失败。
- ✅ Composition API：
setup(props, { emit }) { emit('save', data) } - ✅
<script setup></script>：const emit = defineEmits(['save', 'cancel'])，再调emit('save', data) - ❌ 绝对不要写：
this.$emit('save', data)—— 不报错，但什么也不会发生
快速验证：加个 console 看事件到底发没发
别只盯着父组件有没有响应，先确认子组件是否真的触发了。
- 在子组件 emit 前加
console.log('emitting save:', data) - 在父组件监听的方法开头加
console.log('received save:', ...arguments) - 如果子组件有 log、父组件没 log → 事件名或监听方式有问题
- 如果两边都有 log → 问题在 handler 内部，不是 emit 本身
