Komponenttien tiedot Reactissa

Komponenttien tietoja voidaan säilyttää kolmessa paikassa: propseissa, komponentin muuttujissa ja vakioissa, sekä tilassa. Propseissa säilytetään tietoja, jotka komponentin ulkopuolinen vanhempikomponentti lähettää sille. Tällöin komponentin sisällä propseiden tulee pysyä muuttumattomina.

Muuttujissa, vakioissa ja tilassa tulee säilyttää paikallisia tietoja, jotka ovat tärkeitä itse komponentille ja joista vanhemman ei tule tietää. Tällöin tilassa tulee säilyttää tietoja, jotka voivat muuttua eri tapahtumissa ja joissa haluat, että muutokset ovat reaktiivisia.

jsxfunction Test() {
  // määritelmä isEdit, elem ja data
  
  if (isEdit) {
    elem = <input value={data} />;
  } else {
    elem = <span>{data}</span>;
  }
  
  return <div>
    {elem}
  </div>;
}