Hello community, I am sharing here a proposal that I find very interesting.

This proposal was made by: @Navidtm in the vue repository in the ideas section.

https://github.com/orgs/vuejs/discussions/12671

The idea is to simplify the syntax of passing a <slot> by name, as follows

Current syntax

<BaseLayout>
  <template #header>
    <h1>header title</h1>
  </template>

  <p>A paragraph</p>
  <p>And another one.</p>

  <template #footer>
    <p>content</p>
  </template>
</BaseLayout>

proposal

<BaseLayout>
  <h1 #header>header title</h1>

  <p>A paragraph</p>
  <p>And another one.</p>

  <p #footer>content</p>
</BaseLayout>

with all that it may imply

v-slot:header or #header
v-slot:[dynamicSlotName] or #[dynamicSlotName]
v-slot:name="slotProps" or #name="slotProps"

As I mentioned, I saw this proposal in the Vue repository.
Proposing a syntax change can always bring debate in the community.

But I think this is the right place to launch this proposal and see the community's acceptance.