In welke gevallen wordt een component in React opnieuw gerenderd?

Het opnieuw renderen van een component in React gebeurt in de volgende gevallen:

• Verandering van de toestand van de component (state) met behulp van setState of hooks useState.
• Verandering van de props die aan de component worden doorgegeven.
• Verandering van de context (Context API), als de component op de context is geabonneerd.
• De oudercomponent is opnieuw gerenderd, en de kindcomponent is niet geoptimaliseerd (bijvoorbeeld, gebruikt niet React.memo).

Voorbeeld:

function MyComponent({ value }) {
  const [count, setCount] = React.useState(0);

  // Bij verandering van count of value, vindt een her-render plaats
  return <div>{value} - {count}</div>;
}