slots Acesso declarativo a slots (3.3+)
Última atualização: 2026-10-22
slots Acesso declarativo a slots (3.3+)
A opção slots declara o acesso a slots como função, produzindo um $slots rastreado — a presença de slots torna-se reativa.
| Grupo | Opções: Renderização e Ciclo de Vida |
|---|---|
| Tipo | Opção |
| Escopo | No Componente |
| Versão do Vue | 3.0+ |
| Suporte a SSR | Sim |
📝 Sintaxe
export default {
slots: { default: () => [], header: () => [] }
}
⚙️ Argumentos
| value | Um objeto cujas chaves são nomes de slots e os valores são funções que retornam o conteúdo |
|---|
Retorno:Sem retorno — popula o $slots
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo:
Saída:
Shows the parent's header content.
💡 Pontos-chave
ℹ️ Nota Adicionado no 3.3 para corrigir verificações desatualizadas de presença de slot.
💡 Dica Preferido em bibliotecas de componentes para verificações de presença.
⚠️ Aviso Liste todos os slots — omissões quebram o acesso.
🏷️ Renderização e Ciclo de Vida relacionados
💡 Casos Relacionados
Mais casos em breve.
📚 Tutoriais Relacionados
❓ FAQ
P Diferença em relação a $slots?
R Os mesmos dados, agora com rastreamento de dependências.
P É preciso listar todos os slots?
R Sim — slots não declarados ficam ausentes.
P Relação com useSlots?
R É a contraparte no estilo options de useSlots().