Vaikimisi väärtused Reactis

Mõnikord võib olla vajadus seada väljale vaikimisi mingi väärtus. Samal ajal on vajalik, et algväärtus võetaks olekust, kuid väli ise ei oleks selle olekuga seotud.

Sellise ülesande lahendamiseks tuleb kasutada atribuuti defaultValue:

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

Märkeruutude jaoks on olemas analoogne atribuut defaultChecked, mille abil saab määrata algse oleku:

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