<slot>
Defines a content outlet where parent-provided markup is rendered.
Syntax
<slot name="x" :prop="value">fallback</slot>Parameters
| Name | Type | Required | Description |
|---|---|---|---|
name | string | No | Slot name; defaults to "default". |
bindings | any | No | Scoped-slot props passed up to the parent template. |
Returns
render outlet — Renders parent content or fallback.
Examples
<!-- Card.vue -->
<template>
<div class="card">
<header><slot name="title">Untitled</slot></header>
<section><slot /></section>
</div>
</template>
<!-- parent -->
<template>
<Card>
<template #title>Hello</template>
<p>Body content</p>
</Card>
</template>
Notes
Content between a `<slot>` tags is fallback shown when the parent provides
nothing. Use a `name` for multiple slots and bind attributes to expose
scoped-slot data, which the parent reads via `v-slot`/`#`. Access slots in
script with useSlots().