Vue return undefined during emit event

Question

I read a code, where it allows user to download attachment

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

But in the downloadAttachment function, it returns undefined, why the emit still works?

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

Answer 1

The return undefined line is rather redundant because that's the default behavior in a function that has no return statement.

The return value of the @Emit-decorated function does not cause an undefined value to be emitted. When the function returns nothing (i.e., undefined), the original event arguments from the caller are emitted, which enables event forwarding. On the other hand, when the function returns any non-undefined value (even null), only that value is emitted.

So in your specific example, the <attachment-link>'s download-attachment event is forwarded as the download event from the component. The emitted event data would still be filename and attachmentId.