Slots let a parent pass template content into a child component — they're how you build flexible, reusable wrappers (cards, modals, layouts) where the consumer controls the inner markup.
Basic slot
<!-- Card.vue -->
<template>
<div class="card">
<slot></slot> <!-- parent's content is injected here -->
</div>
</template>
<!-- parent -->
<Card>
<h2>Title</h2> <!-- this markup fills the slot -->
<p>Any content!</p>
</Card>
The child defines a "hole" (); the parent fills it with whatever markup it wants. This is far more flexible than passing strings via props.
