<slot> Saída de Slot
Última atualização: 2026-10-22
<slot> Saída de Slot
O
| Grupo | Integrados |
|---|---|
| Tipo | Componente / Elemento |
| Escopo | Template |
| Versão do Vue | 3.0+ |
| Suporte a SSR | Sim |
📝 Sintaxe
<slot></slot>
<slot name="header">Cabeçalho padrão</slot>
<!-- slot com escopo: passa dados do filho para fora -->
<slot :item="item"></slot>⚙️ Argumentos
| props | name (slot nomeado, o padrão é default); atributos extras podem ser passados como dados de escopo |
|---|
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo:
Saída：
Shows the parent's custom header and body content.💡 Pontos-chave
💡 Dica O conteúdo padrão aparece apenas quando o pai não passa nada; é a prática padrão para UI de reserva.
ℹ️ Nota O slot com escopo passa os dados do filho de volta ao pai (núcleo da personalização de componentes de lista).
⚠️ Aviso O conteúdo do slot é compilado no escopo do pai: ele não acessa diretamente os dados do filho (use slots com escopo).
🏷️ Integrados relacionados
💡 Casos Relacionados
Mais casos em breve.
📚 Tutoriais Relacionados
❓ FAQ
P E se o pai não passar conteúdo?
R Aparece o conteúdo padrão dentro do <slot>; sem conteúdo padrão, nada é renderizado.
P Quantos slots um componente pode ter?
R Quantos quiser: um padrão + vários nomeados.
P O conteúdo do slot pode acessar os dados do filho?
R Não, a menos que os dados sejam passados para fora via props de slot com escopo.
