# Slot nominati in Vue 3: comporre componenti senza nuove props

Gli slot nominati lasciano al genitore il compito di riempire zone precise del figlio: il componente detta il layout, la pagina mette il contenuto.

> Pagina: https://ui.eneawork.it/blog/vue-3-slots-nominati
> Markdown: https://ui.eneawork.it/blog/vue-3-slots-nominati.md

*2026-11-01*

Uno slot nominato è un buco con un nome: il figlio dichiara <slot name="header">, il genitore riempie con <template #header>. Il componente resta senza props e senza logica di contenuto.

Misurato il 1 novembre 2026: il catalogo conta 111.985 componenti, 1.556 blocchi e 12.808 icone da 1.472 librerie, letti da /api/stats. Su 1.514 profili di libreria 10 riguardano Vue, 8 dei quali dichiarano licenza MIT: Le librerie Vue del catalogo usano la stessa convenzione nei componenti di layout. Metodo: lettura di data/library_profiles.json e della risposta di /api/stats con uno script Node, sul repository EneUI.

## Il componente che detta il layout

defineProps(); {{ title }}

Il contenuto dentro <slot> è il fallback: appare solo se il genitore non passa nulla. Così la card funziona da sola e accetta personalizzazioni quando servono.

## Slot con scope: dati dal figlio al genitore

const rows = [ { id: 1, name: "Ada", role: "admin" }, { id: 2, name: "Linus", role: "editor" }, ]; {{ row.name }}

Il figlio decide quali dati esporre, il genitore come mostrarli. È la differenza con una prop: qui la struttura resta nel figlio e la resa grafica nel genitore.

## Slot o props?

## Errori comuni

## Il limite da mettere in conto

Gli slot non hanno un contratto di tipo sul contenuto: TypeScript controlla i dati di uno scoped slot, non ciò che il genitore scrive dentro. Un nome sbagliato produce un buco silenzioso, non un errore di compilazione.

## Dove continuare

Nel catalogo: shadcn-vue, vue-bits e Ant Design Vue; i layout pronti sono in /blocks. Le guide: Composition API e props che non si aggiornano. Il confronto: Vue vs React, dove lo stesso problema si risolve con children.

## FAQ

### Uno slot nominato può avere un default?

Sì: il contenuto scritto dentro il tag slot nel figlio è il fallback e appare solo quando il genitore non passa nulla.

### Qual è la differenza con le props?

Le props trasportano dati, gli slot trasportano markup. Con markup ricco gli slot evitano di far conoscere al figlio i componenti del genitore.

### Che cosa sono gli scoped slot?

Slot che espongono dati del figlio al genitore tramite attributi sul tag slot. Il genitore li legge con v-slot e decide come renderli.

### Posso avere più slot di default?

No, il default è uno solo. Contenuti multipli nel default vengono concatenati, quindi per zone distinte servono nomi distinti.

### Gli slot rompono la reattività?

No. Il contenuto dello slot resta nel contesto del genitore e mantiene le sue dipendenze reattive.
