Valores Padrão no React

Às vezes, pode ser necessário fazer com que um campo de entrada (input) já tenha um valor por padrão. No entanto, é importante que apenas o valor inicial do campo seja obtido do estado, e que o campo em si não fique vinculado a esse estado.

Para resolver essa tarefa, você deve usar o atributo defaultValue:

jsxfunction App() {
  const [value, setValue] = useState('text');
  
  return <div>
    <input defaultValue={value} />
  </div>;
}

Para caixas de seleção (checkbox), existe um atributo análogo defaultChecked, com o qual você pode definir o estado inicial:

jsxfunction App() {
  const [checked, setChecked] = useState(true);
  
  return <div>
    <input type="checkbox" defaultChecked={checked} />
  </div>;
}