Is # the same as v-slot:?

Exactly equivalent; bare v-slot means the default slot.

What is a scoped slot?

The child passes data out via slot props (e.g. #default="{ item }"), enabling custom list rendering.

No — only on <template> or a component tag, the most common error source.

Last updated: 2026-10-22

v-slot declares slot content, shorthand #. It passes template fragments into a child component's named or scoped slots.

<template v-slot:header>...</template>
<template #default="{ item }">...</template>
<Child v-slot="{ data }">

expression	Slot name (omitted for the default slot); scoped slots destructure child-provided data

Returns：Directive, no return value

Edit the code below and see the live result:

Output：

The page shows a bold 'Custom header' — parent content replaced the slot default.

💡 Tip # is shorthand for v-slot: — #header equals v-slot:header.

⚠️ Warning v-slot works only on