XP 0

Props são só leitura + reuso

O poder de verdade: reutilização

O objetivo das props: o mesmo componente exibindo dados diferentes.

<Produto nome="Planta Aurora" preco={25} />
<Produto nome="Vaso de cerâmica" preco={40} />
<Produto nome="Adubo natural" preco={15} />

Um componente Produto, três produtos na tela. Conserte o Produto uma vez → conserta os três.

⚠️ Regra importante: props são somente leitura. O componente as props, mas não as altera. Dado que muda dentro do componente é outra coisa — o estado (próximo módulo).

🧠 Modelo mental: props são como o crachá que a pessoa recebe na entrada. Ela usa o crachá, mas não sai reescrevendo o próprio nome nele.

Pontos-chave

  • props são read-only
    o componente lê as props, mas não as altera.