option.md

title	<option>

বিল্ট-ইন ব্রাউজার <option> কম্পোনেন্ট আপনাকে একটি <select> বক্সের মধ্যে একটি অপশন তৈরি করার সুযোগ দেয়।

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

---

রেফারেন্স {/reference/}

<option> {/option/}

বিল্ট-ইন ব্রাউজার <option> কম্পোনেন্ট আপনাকে একটি <select> বক্সের মধ্যে একটি অপশন তৈরি করার সুযোগ দেয়।

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

নিচে আরো উদাহরণ দেখুন।

প্রপ {/props/}

<option> সকল কমন এলিমেন্ট প্রপের সাপোর্ট দেয়।

সাথে সাথে, <option> এই প্রপগুলোর সাপোর্ট দেয়ঃ

• disabled: একটি বুলিয়ান. true হলে, অপশন সিলেক্ট করা যাবে না এবং dimmed দেখাবে এটাকে।
• label: একটি স্ট্রিং। অপশনটা কী বুঝাচ্ছে সেটা নির্দেশ করে। যদি নির্দিষ্ট না করা হয়, তবে অপশনের মধ্যকার টেক্সট ব্যবহৃত হয়।
• value: যখন একটা ফর্মে প্যারেন্ট <select> সাবমিট করা হয় তখন এই অপশনটা সিলেক্ট করা হলে যেই ভ্যালু ব্যবহৃত হবে।

সতর্কতা {/caveats/}

• React <option> এ selected এট্রিবিউট সাপোর্ট করে না। বরং, একটি অনিয়ন্ত্রিত সিলেক্ট বক্সের জন্য এই অপশনের value প্যারেন্ট <select defaultValue> এ পাস করে দিন, অথবা একটি নিয়ন্ত্রিত সিলেক্ট এর জন্য <select value> এ পাস করুন।

---

ব্যবহার {/usage/}

অপশন সহ একটি সিলেক্ট বক্স প্রদর্শন করা {/displaying-a-select-box-with-options/}

একটি সিলেক্ট বক্স প্রদর্শনের জন্য একটি <option> এর লিস্ট সহ <select> রেন্ডার করুন। প্রতিটা <option> এ একটি 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>
  );
}

select { margin: 5px; }