Giá trị mặc định trong React

Đôi khi có thể cần thiết để làm sao cho theo mặc định trong ô nhập liệu đã có sẵn một giá trị nào đó. Đồng thời cần đảm bảo rằng từ trạng thái chỉ được lấy giá trị ban đầu của ô nhập liệu, còn bản thân ô nhập liệu không bị ràng buộc với trạng thái đó.

Để giải quyết nhiệm vụ như vậy, cần sử dụng thuộc tính defaultValue:

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

Đối với các hộp kiểm tồn tại thuộc tính tương tự defaultChecked, với sự trợ giúp của nó có thể thiết lập trạng thái ban đầu:

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