Bekerja dengan select di React

Sekarang mari kita berurusan dengan daftar dropdown select. Cara kerjanya juga hampir tidak berbeda dari bekerja dengan input dan kotak centang.

Misalkan kita memiliki select seperti ini:

jsxfunction App() {
  return <div>
    <select>
      <option>text1</option>
      <option>text2</option>
      <option>text3</option>
      <option>text4</option>
    </select>
  </div>;
}

Mari kita berikan fungsionalitasnya menggunakan React:

jsxfunction App() {
  const [value, setValue] = useState('');
  
  function handleChange(event) {
    setValue(event.target.value);
  }
  
  return <div>
    <select value={value} onChange={handleChange}>
      <option>text1</option>
      <option>text2</option>
      <option>text3</option>
      <option>text4</option>
    </select>
    <p>
      pilihan Anda: {value}
    </p>
  </div>;
}