Vue official way of implementing Fallthrough Slots, extending components

[camiloforero]

There is already a feature request in #575 that talks about how could fallthrough slots be implemented, similarly to fallthrough props and events.

However, in that thread, a very nice snippet (edited, thanks @jimp100) :

<template v-for="(_, name) in $slots" #[name]="scope">
  <slot :name v-bind="scope ?? {}"/>
</template>

was provided. To me it looks like the best currently known way to accomplish this, and I created a snippet that showcases how it works.

The two things I want to discuss here are:

1. Would it be a good idea to add this snippet to the slots documentation, as a new "Fallthrough Slots" section? I can write that PR and redact the documentation, as soon as I'm greenlighted.

2. As a more open discussion, I got into this because I was looking for the best vue way to extend library components with new functionality while keeping all of the default functionality. However, I spent some time looking for ways to extend components, and reached a few dead ends before zeroing on this solution (declare the component I want to extend as the root node of my own wrapper component, take advantage of fallthrough props and events, and use this snippet for slots). Would it help to make this a new section under the docs "Reusability" section?

[jimp100]

Thanks, your code snippet was super helpful. I had to make a small modification for my particular implementation, thought I'd share it.

<template v-for="(_, name) in $slots" #[name]="scope">
  <slot :name v-bind="scope ?? {}" />
</template>

I added the nullish coalescing operator (??) on the slot v-bind, as I was seeing TypeError: props is null errors in some usages.