onDestroy: limpeza
Execute a lógica de desmontagem, como limpar temporizadores ou cancelar inscrições, quando o componente for removido.
onDestroy: limpeza é uma aula grátis de Sveltejs Academy no CoddyKit. Esta é a aula 2 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Sveltejs Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Sveltejs Academy inclui 4 aulas no total.
Por que usar onDestroy
onDestroy é executado quando um componente é removido do DOM. Use-o para desativar ouvintes, temporizadores ou inscrições.
Importar e chamar
Importe de svelte e passe uma função de retorno.
<script>
import { onDestroy } from "svelte";
onDestroy(() => console.log("bye"));
</script>Padrão de limpeza
Cancele temporizadores, interrompa solicitações de busca e cancele inscrições em armazenamentos.
onDestroy(() => clearInterval(id));Vários onDestroys
Chame quantas vezes for necessário. Cada limpeza será executada.
Também é executado no servidor
Ao contrário de onMount, onDestroy é executado no servidor durante a desmontagem do SSR.
Combinar com onMount
Um padrão comum é configurar tudo em onMount e desfazer a configuração em onDestroy.
Ou simplesmente retorne de onMount
Retornar uma função de onMount equivale a usar onDestroy para limpezas simples e mantém o código no mesmo lugar.
Evitar efeitos colaterais na destruição
Mantenha a limpeza síncrona e rápida. Trabalhos assíncronos longos podem não terminar antes da navegação.
Inscrição automática em armazenamentos
Se você usar a forma abreviada $store, o Svelte cancela automaticamente a inscrição durante a destruição — não é necessário usar onDestroy manualmente.
Vazamentos de memória
Esquecer a limpeza é a principal fonte de vazamentos de memória em aplicações de página única. Sempre desative os ouvintes globais que você adicionou.
Páginas vs. componentes
As alterações de rota destroem os componentes da página, acionando onDestroy. Use-o também para a limpeza específica de cada página.
Verificação rápida
Qual é a maneira mais simples de associar a configuração e a desmontagem?
Recapitulação
onDestroy é executado quando o componente é desmontado. Use-o (ou o retorno de onMount) para limpar ouvintes e temporizadores.
Perguntas Frequentes
A aula “onDestroy: limpeza” é grátis?
Sim — o texto completo de “onDestroy: limpeza” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Sveltejs Academy, atualize para CoddyKit PRO. O curso de Sveltejs Academy inclui 4 aulas no total.
O que vou aprender em “onDestroy: limpeza”?
Execute a lógica de desmontagem, como limpar temporizadores ou cancelar inscrições, quando o componente for removido. Você pratica Sveltejs Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar Sveltejs Academy?
Nenhuma experiência prévia é necessária. Sveltejs Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 4.
Quanto tempo leva a aula “onDestroy: limpeza”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de Sveltejs Academy?
Sim. Cada aula de Sveltejs Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- onMount: execução após a renderização
- onDestroy: limpeza
- beforeUpdate e afterUpdate
- tick(): aguardando atualizações do DOM