Dados de Componentes no React

Os dados dos componentes podem ser armazenados em três locais: em props, em variáveis e constantes do componente, e em estados. As props armazenam dados que são enviados ao componente externamente por seu componente pai. Dentro do componente, as props devem permanecer imutáveis.

Em variáveis, constantes e estados, devem ser armazenados dados locais, que são importantes para o próprio componente e sobre os quais o pai não precisa saber. Nos estados, devem ser armazenados dados que podem mudar em vários eventos e onde você deseja que as mudanças sejam reativas.

jsxfunction Test() {
  // definição de isEdit, elem e data
  
  if (isEdit) {
    elem = <input value={data} />;
  } else {
    elem = <span>{data}</span>;
  }
  
  return <div>
    {elem}
  </div>;
}