Web Tarayıcısının <option> bileşeni, <select> kutusu içinde bir seçenek sunmanıza olanak tanır.

<select>
   <option value="birSecenek">Bir seçenek</option>
   <option value="digerSecenek">Diğer seçenek</option>
</select>

Başvuru dokümanı

<option>

Web Tarayıcısının <option> bileşeni <select> kutusunun içinde bir seçenek oluşturmanıza olanak tanır.

<select>
   <option value="birSecenek">Bir seçenek</option>
   <option value="digerSecenek">Diğer seçenek</option>
</select>

Buradan daha fazla örnek görebilirsiniz.

Prop’lar

<option>, tüm genel öğe özelliklerini destekler.

Ayrıca, <option> bu özellikleri de destekler:

Uyarılar

  • React, <option> öğesinde selected özelliğini desteklemez. Bunun yerine, bu seçeneğin value değerini ebeveyn <select defaultValue> öğesine aktararak kontrolsüz bir seçim kutusu oluşturun veya <select value> öğesine aktararak kontrollü bir seçim kutusu oluşturun.

Kullanım

Seçenekler içeren bir seçim kutusu gösterme

Seçim kutusu oluşturmak için, içerisinde <option> bileşenleri bulunan <select> öğesi kullanın. Her bir <option> bileşenine, form ile gönderilecek verileri temsil eden bir value değeri atayın.

İçerisinde <option> bileşenleri bulunan bir <select> öğesini göstermek hakkında daha fazla bilgi edinin.

export default function MeyveSecici() {
  return (
    <label>
      Bir meyve seçin:
      <select name="secilenMeyve">
        <option value="apple">Elma</option>
        <option value="banana">Muz</option>
        <option value="orange">Portakal</option>
      </select>
    </label>
  );
}
Previous<input>
Next<progress>