রিঅ্যাক্টজেএস-এ নিয়ন্ত্রিত উপাদান এবং অনিয়ন্ত্রিত উপাদানগুলি কী কী? তারা একে অপরের থেকে কীভাবে আলাদা?
উত্তর:
এটি রাষ্ট্রীয় ডিওএম উপাদানগুলির সাথে সম্পর্কিত (ফর্ম উপাদানগুলি) এবং প্রতিক্রিয়াযুক্ত ডক্স পার্থক্যটি ব্যাখ্যা করে:
propsএবং কলব্যাকের মাধ্যমে পরিবর্তনগুলি সূচিত করে onChange। কোনও পিতা বা মাতা উপাদান কলব্যাক পরিচালনা করে এবং তার নিজস্ব রাজ্য পরিচালনা করে এবং নিয়ন্ত্রিত উপাদানটিতে প্রপস হিসাবে নতুন মানগুলি পাস করে এটি "নিয়ন্ত্রণ" করে। আপনি এটিকে "বোবা উপাদান "ও বলতে পারেন।refযখন প্রয়োজন তখন ডমকে তার বর্তমান মানটি খুঁজে পেতে জিজ্ঞাসা করেন । এটি কিছুটা বেশি গতানুগতিক HTML এর মতো।বেশিরভাগ নেটিভ রিঅ্যাক্ট ফর্ম উপাদানগুলি নিয়ন্ত্রিত এবং অনিয়ন্ত্রিত উভয় ব্যবহারকে সমর্থন করে:
// Controlled:
<input type="text" value={value} onChange={handleChange} />
// Uncontrolled:
<input type="text" defaultValue="foo" ref={inputRef} />
// Use `inputRef.current.value` to read the current value of <input>
বেশিরভাগ (বা সমস্ত) ক্ষেত্রে আপনার নিয়ন্ত্রিত উপাদানগুলি ব্যবহার করা উচিত ।
stateতার চেয়ে বেশি নেওয়া হয় না props?
props। একটি অনিয়ন্ত্রিত উপাদান stateঅভ্যন্তরীণভাবে মানটি নিজেই নিয়ন্ত্রণ করতে ব্যবহার করবে । এটিই মূল পার্থক্য।
controlled components( <input type="text" value="value" onChange={handleChangeCallbackFn} />) বনাম .তিহ্যবাহী এইচটিএমএল বলা হয় যেখানে কোনও ইনপুট উপাদান তাদের নিজস্ব মান হ্যান্ডেল করে এবং ( ) refsনামক মাধ্যমে পড়া যায় । নিয়ন্ত্রিত উপাদানগুলি তাদের নিজস্ব রাষ্ট্র পরিচালনা করে বা তাদের প্যারেন্ট উপাদান থেকে প্রপস হিসাবে পেয়ে থাকে। uncontrolled components<value type="text" />setState
defaultValueপ্রপসের মাধ্যমে এটি পাওয়া এমন কোনও উপাদানকে আপনি কীভাবে কল করবেন , তবে যা নিয়ামককে জানিয়ে দেয় onBlur?
<Button onClick={() => console.log("clicked")}>Click</Button>।নিয়ন্ত্রিত উপাদানটি এমন উপাদান যা কলব্যাক ফাংশন থেকে পরিবর্তিত মান পায় এবং অনিয়ন্ত্রিত উপাদানটি এমন উপাদান যা ডিওএম থেকে থাকে। উদাহরণস্বরূপ, যখন ইনপুট মান পরিবর্তন করা হয়, আমরা নিয়ন্ত্রিত উপাদানগুলিতে onChange ফাংশনটি ব্যবহার করতে পারি এবং আমরা রেফের মতো DOM ব্যবহার করে মানটি পেতে পারি।