API Reference
Components

<option>

உலாவியில் உள்ளமைந்த <option> component, <select> box-க்குள் option ஒன்றை render செய்ய உதவுகிறது.

<select>
  <option value="someOption">Some option</option>
  <option value="otherOption">Other option</option>
</select>

Reference

<option>

உலாவியில் உள்ளமைந்த <option> component, <select> box-க்குள் option ஒன்றை render செய்ய உதவுகிறது.

<select>
  <option value="someOption">Some option</option>
  <option value="otherOption">Other option</option>
</select>

மேலும் உதாரணங்களை கீழே பார்க்கவும்.

Props

<option> அனைத்து common element props-ஐ ஆதரிக்கிறது.

மேலும், <option> இந்த props-ஐ ஆதரிக்கிறது:

  • disabled: ஒரு boolean. true என்றால், அந்த option தேர்ந்தெடுக்க முடியாததாக இருக்கும் மற்றும் மங்கலாகத் தோன்றும்.
  • label: ஒரு string. Option-இன் பொருளை குறிப்பிடுகிறது. குறிப்பிடப்படவில்லை என்றால், option உள்ளே இருக்கும் text பயன்படுத்தப்படும்.
  • value: இந்த option தேர்ந்தெடுக்கப்பட்டிருந்தால், parent <select> form-இல் submit செய்யப்படும் போது பயன்படுத்தப்படும் value.

Caveats

  • <option>-இல் selected attribute-ஐ React ஆதரிக்காது. அதற்கு பதிலாக, uncontrolled select box-க்கு parent <select defaultValue>-க்கு, அல்லது controlled select-க்கு <select value>-க்கு இந்த option-இன் value-ஐ pass செய்யுங்கள்.

Usage

Options உடன் select box காட்டுதல்

Select box ஒன்றைக் காட்ட, உள்ளே <option> components பட்டியலுடன் <select>-ஐ render செய்யுங்கள். Form-உடன் submit செய்யப்பட வேண்டிய data-வை குறிக்கும் value ஒன்றை ஒவ்வொரு <option>-க்கும் கொடுங்கள்.

விருப்பங்கள் பட்டியலுடன் <select>-ஐ காட்டுவது பற்றி மேலும் படிக்கவும்.

export default function FruitPicker() {
  return (
    <label>
      Pick a fruit:
      <select name="selectedFruit">
        <option value="apple">Apple</option>
        <option value="banana">Banana</option>
        <option value="orange">Orange</option>
      </select>
    </label>
  );
}
Previous<input>
Next<progress>