3.1 KiB
title | localeTitle |
---|---|
Life Cycle Methods Of A Component | Métodos de Ciclo de Vida de um Componente |
Métodos de Ciclo de Vida de um Componente
Quando começamos a trabalhar com componentes, precisamos executar várias ações para atualizar o estado ou executar algumas ações quando algo muda nesse componente. Neste cenário, os métodos de ciclo de vida de um componente são úteis !! Então, vamos mergulhar neles neste artigo.
Em termos gerais, podemos dividir os métodos do ciclo de vida em 3 categorias.
- Montagem
- Atualizando
- Desmontando
Como os métodos do ciclo de vida são auto-explicativos, vou mencionar os nomes dos métodos. Por favor, sinta-se à vontade para contribuir com este artigo, se necessário.
Montagem:
uma. constructor()
b. componentWillMount()
c. render()
d. componentDidMount()
Atualizando:
uma. componentWillRecieveProps()
b. shouldComponentUpdate()
c. componentWillUpdate()
d. render()
e. componentDidUpdate()
Desmontando:
uma. componentWillUnmount()
Alguns fatos interessantes para notar:
constructor
,componentWillMount
,componentDidMount
ecomponentWillUnmount
serão chamados apenas uma vez durante o ciclo de vida de um componente.componentWillUpdate
ecomponentDidUpdate
só serão executados se e somente seshouldComponentUpdate
retornar true.componentWillUnmount()
será chamado pouco antes de desmontar qualquer componente e, portanto, pode ser usado para liberar a memória usada, fechar quaisquer conexões com o banco de dados, etc.
Muitas coisas podem ser aprendidas mergulhando na codificação. Então, sujem suas mãos codificando.
Nota:
"Os avisos de descontinuação serão ativados com uma versão 16.x futura, mas os ciclos de vida herdados continuarão funcionando até a versão 17. " 1
"Mesmo na versão 17, ainda será possível usá-los, mas eles serão aliados com um prefixo" UNSAFE_ "para indicar que podem causar problemas. Também preparamos um script automatizado para renomeá-los no código existente." 1
Em outras palavras, esses métodos de ciclo de vida previos ainda estarão disponíveis como:
UNSAFE_componentWillMount
UNSAFE_componentWillReceiveProps
UNSAFE_componentWillUpdate
Novos métodos de ciclo de vida
Novos métodos de ciclo de vida serão introduzidos no React 17
getDerivedStateFromProps
será uma alternativa mais segura paracomponentWillReceiveProps
.getSnapshotBeforeUpdate
será adicionado para suportar a leitura segura de propriedades das atualizações do DOM são feitas
Muitas coisas podem ser aprendidas mergulhando na codificação. Então, sujem suas mãos codificando.