Problem Statement
What are scoped slots and when would you use them?
Explanation
Scoped slots pass data from a child to the slot content defined in the parent. Use them for render flexibility (e.g., list/grid rendering with custom item templates). The child exposes slot props; the parent consumes them via v-slot.
Code Solution
SolutionRead Only
<!-- Child.vue -->
<template>
<ul>
<li v-for="item in items" :key="item.id">
<slot name="item" :item="item">{{ item.label }}</slot>
</li>
</ul>
</template>
<!-- Parent.vue -->
<List :items="rows">
<template #item="{ item }">
<strong>{{ item.label }}</strong>
</template>
</List>