Middle+
Do que depende a re-renderização de um componente no React?
sobes.tech IA
Resposta da IA
A re-renderização de um componente no React depende de vários fatores:
- Alteração de props — se o componente pai passar novas propriedades, o componente será re-renderizado.
- Alteração de estado — chamar setState ou alterar o estado através de hooks (useState) inicia uma nova renderização.
- Alteração de contexto (Context API) — se o contexto ao qual o componente está inscrito mudar.
- forceUpdate() — chamada forçada para re-renderizar.
O React compara superficialmente as novas e antigas props e estado (comparação superficial). Se os valores não mudarem, a re-renderização pode ser ignorada (por exemplo, usando React.memo ou shouldComponentUpdate).
Exemplo com o hook useState:
function Counter() {
const [count, setCount] = React.useState(0);
// Ao chamar setCount, o componente re-renderiza
return <button onClick={() => setCount(count + 1)}>{count}</button>;
}
Portanto, a re-renderização depende das mudanças nos dados de entrada do componente e no seu estado interno.