defineemits需在顶层调用，支持数组写法（如['submit', 'cancel']）和ts泛型对象写法（如{ 'submit': (data: { id: number; name: string }) => void }），后者更推荐以保障类型安全与ide提示。

const emit = defineEmits  'submit': (data: { id: number; name: string }) => void;<br>  'cancel': () => void;<br>  'update:modelValue': (val: string) => void;<br>()

命名要注意 update:xxx 格式

如果子组件接收了某个 prop（比如 modelValue 或 title），想通知父组件更新它，事件名应统一用 update:xxx 形式：

vue-component-analyzer

递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。

下载

• 接收 modelValue → 声明 'update:modelValue' → 父组件可直接用 v-model
• 接收 title → 声明 'update:title' → 父组件可用 v-model:title
• 避免写成 onUpdateTitle 或 changeTitle，否则无法对接 v-model 机制

怎么触发事件才合法

声明后拿到的 emit 是一个函数，调用时必须严格匹配声明的内容：

• 事件名大小写、连字符、冒号都要完全一致（比如 update:modelValue 不能写成 updateModelValue）
• 参数数量和类型必须吻合泛型声明（TS 下传错会立刻报错，如把字符串传给期望 number 的 update:count）
• 常见调用示例：
  emit('cancel')（无参）
  emit('submit', { id: 1, name: 'Vue' })（对象参数）
  emit('update:modelValue', 'new text')（v-model 场景）

别踩这些坑

几个高频错误要避开：

• 在模板里写 @click="$emit('xxx')" —— `