Entendendo os ganchos do ciclo de vida do componente

No contexto da programação, particularmente em estruturas como React, Angular e Vue.js, ganchos de ciclo de vida são funções que são executadas automaticamente em pontos específicos durante o ciclo de vida de um componente. Eles permitem que os desenvolvedores adicionem seu próprio código nesses estágios, o que pode ser útil para uma variedade de tarefas, como buscar dados, atualizar o DOM, limpar antes que o componente seja destruído e muito mais.

Aqui está uma breve visão geral de alguns ganchos de ciclo de vida comuns nessas estruturas:

1. **React:**
- `componentDidMount`: Este método é chamado uma vez que o componente é inserido na árvore DOM. É um bom lugar para iniciar solicitações de rede, definir temporizadores, etc.
- `componentDidUpdate`: Este método é chamado depois que o componente é atualizado no DOM. É um bom lugar para fazer solicitações de rede com base em alterações de prop.
- `componentWillUnmount`: Este método é chamado logo antes do componente ser removido do DOM. É um bom lugar para fazer tarefas de limpeza como invalidar temporizadores, cancelar solicitações de rede ou limpar quaisquer assinaturas que foram criadas em `componentDidMount`.

2. **Angular:**
- `ngOnInit`: É chamado assim que o componente é inicializado. É um bom lugar para colocar a lógica de inicialização.
- `ngOnChanges`: Isso é chamado sempre que uma ou mais propriedades de entrada vinculadas a dados são alteradas. É um bom lugar para colocar o código que reage às alterações de entrada.
- `ngOnDestroy`: Isso é chamado logo antes do Angular destruir a diretiva/componente. É um bom lugar para colocar a lógica de limpeza.

3. **Vue.js:**
- `created`: Isto é chamado depois que a instância é criada. Nesse estágio, a instância concluiu o processamento das opções, o que significa que a instância inicializou a observação de dados, propriedades computadas, métodos, retornos de chamada de observação/evento. No entanto, a fase de montagem não foi iniciada e a propriedade `$el` ainda não estará disponível.
- `mounted`: Isto é chamado depois que a instância foi montada. Quando esse gancho é chamado, o componente DOM foi atualizado, para que você possa acessar os dados do componente reativo e operar no DOM.
- `beforeDestroy` e `destroyed`: Estes são chamados antes e depois da instância ter sido destruída. É um bom lugar para colocar a lógica de limpeza.

Lembre-se de que os nomes e comportamentos exatos desses ganchos podem variar entre as estruturas, por isso é importante consultar a documentação oficial da estrutura específica que você está usando.