Cosa sono le props nel contesto di React?

props (da inglese properties) in React è un oggetto che contiene i dati trasmessi dal componente genitore a quello figlio. Sono disponibili all'interno del componente figlio solo in modalità di sola lettura e rappresentano il meccanismo principale per trasmettere informazioni verso il basso nell'albero dei componenti.

Caratteristiche principali di props:

• Trasmissione di dati: Servono per trasmettere dati, configurazioni e callback dal genitore al figlio.
• Immutabilità: All'interno del componente figlio, props non possono essere modificati. Qualsiasi modifica deve provenire dal componente genitore, che passa nuovi props.
• Oggetto: props vengono sempre passati come oggetto. Ogni proprietà passata diventa una chiave in questo oggetto.
• Accesso: Nei componenti funzionali, props vengono passati come primo argomento della funzione. Nei componenti di classe, sono accessibili tramite this.props.

Esempio di trasmissione e utilizzo di props:

// Componente genitore
function ParentComponent() {
  const greeting = "Ciao";
  return <ChildComponent message={greeting} />;
}

// Componente figlio
function ChildComponent(props) {
  return <p>{props.message}, mondo!</p>;
}