Skip to content

shorthand syntax for v-bind does not work for "name" property in slots #10213

Closed
@HighLiuk

Description

@HighLiuk

Vue version

3.4.15

Link to minimal reproduction

https://play.vuejs.org/#eNp9kk9PAjEQxb9KUw+rCdk9cEM08Q8HPShRb9bDZhmg2G2bThdIyH53ZwqLEoFb573fbGf6diPvvM+XDciBHGIVtI8CITb+VlldexeieHC1F9PgapHlBReMZ9fKDottA6FURKi9KSNQJcQwNdmyhhslI2BUMunkdJy4YH2nCvHoAIV1dPvcrXZocfjNdDkdD3TZkxErZ6d6li/QWdpjw7SSFdHaQHj1UTuLSg5EctgrjXGr56TF0ECv06s5VN9H9AWuWVNyHAAhLEHJvRfLMANakO3R+wus6bw3azdpDNFnzDdAZxqecYvdN3ZCY//h0rRPKQ1tZx84Wkew2C3FgzLZJl5JSocf6tTqv+P2837qU7alV+ySPfIjTGCqLYyD83j5mXGq2dfV+fzRUJQDRkXxL7L2B3jp0N0=

Steps to reproduce

<!-- App.vue -->
<script setup>
import Component from './Component.vue';
</script>

<template>
  <Component name="test">
    <template #test>
      Does not show
    </template>
  </Component>
</template>

<!-- Component.vue -->
<script setup>
defineProps(['name'])
</script>

<template>
  <slot :name /> <!-- works if :name="name" -->
</template>

What is expected?

It should work as if we wrote :name="name" as of Vue 3.4 which has released this feature with #9451:

https://blog.vuejs.org/posts/vue-3-4#v-bind-same-name-shorthand

What is actually happening?

No slot is shown. No errors in the console.

System Info

No response

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions