Como Fazer componentDidMount Com React Hook

O react introduziu em sua versão 16.7.0 os Hooks, que tem como objetivo trabalhar os estados e outras funcionalidades sem precisar criar uma classe!
E com a chegada dos Hooks, uma pergunta que pode ser frequente é, como podemos chamar os eventos do componente, como o componentDidMount dentro de um
componente stateful?

Para acionarmos uma função, que no momento que estamos carregando o componente (igual ao componentDidMount),
devemos usar um hook chamado useEffect().

Então, nosso código deve ficar da seguinte forma:

1
2
3
4
5
6
7
import { useEffect } from "react";
const nossoComponent = () => {
useEffect(() => {
// Lógica para quando carregar
// o componente.
}, []);
};

O useEffect é um React hook onde podemos utilizar quando precisamos pegar dados do servidor, por exemplo.

O primeiro argumento é um callback, que será acionado após o navegador e o layout da página aparecerem.

O segundo argumento é um array de valores, quando passado vazio ele é acionado sempre a cada renderização, similar ao componentDidMount