Vue中emit事件对应处理方法返回undefined为何事件仍正常工作

在阅读支持用户下载附件的业务代码时，看到如下模板实现：

<template #link="{ item, rowdata }">
  <attachment-link
    v-test-id="'attachment-link'"
    :inventory-id="item"
    :filename="rowdata['fileName']"
    @download-attachment="downloadAttachment">
  </attachment-link>
</template>

上述代码为attachment-link组件绑定了download-attachment事件监听，事件触发时会调用downloadAttachment方法，该方法的实现如下：

@Emit('download')
private downloadAttachment(filename: string, attachmentId: string) {
  return undefined;
}

为什么该downloadAttachment方法显式返回undefined，对应的emit事件依然可以正常工作？ #

这个现象是Vue类组件装饰器库中@Emit装饰器的默认运行规则导致的：

• 事件触发逻辑和方法返回值没有强绑定：只要被@Emit装饰的方法被调用，装饰器就会自动在当前组件实例上触发声明好的自定义事件（这里就是download事件），不会因为方法返回undefined就中断事件抛出流程。
• @Emit对返回值的处理有明确的分支逻辑：
  • 如果被装饰方法返回非undefined的值，装饰器会把这个返回值作为事件载荷，传给父组件绑定的事件回调
  • 如果被装饰方法返回undefined（包括省略return、函数默认返回undefined的情况），装饰器会直接把调用该方法时传入的所有参数，按原顺序透传作为事件载荷
• 这里显式写return undefined和不写return的运行效果完全一致，本质是开发者显式标注：这个方法不需要自定义返回值作为事件参数，直接把调用时收到的filename、attachmentId两个参数透传给父组件的download事件监听即可，完全不会影响事件正常触发。

内容的提问来源于stack exchange，提问作者hades