கட்டுப்படுத்தப்பட்ட மற்றும் கட்டுப்படுத்தப்படாத உள்ளீடுகளுக்கு இடையே உள்ள வேறுபாடு என்ன?

Question

Accepted Answer

இது **உள்ளீட்டின் மதிப்பிற்கான உண்மையின் மூலம் யார்** — React state அல்லது DOM தன்னை. ## இது ஏன் முக்கியம் ### கட்டுப்படுத்தப்பட்ட (React மதிப்பை소유) உள்ளீட்டின் `value` state ஆல் இயக்கப்படுகிறது, மற்றும் `onChange` state ஐ ஒத்திசைக்கிறது. DOM எப்போதும் React ஐ பிரதிபலிக்கிறது: ```jsx const [name, setName] = useState(""); setName(e.target.value)} // every keystroke updates state /> ``` State உண்மையின் மூலம் என்பதால், ஒவ்வொரு விசைஅழுத்தத்திலும் சரிபார்க்க, வடிவமைக்க அல்லது மாற்றலாம் (உ.கா., பெரிய எழுத்தை கட்டாயப்படுத்த, நீளத்தை கட்டுப்படுத்த, சமர்ப்பித்தல் பொத்தானை முடக்க). ### கட்டுப்படுத்தப்படாத (DOM மதிப்பை소유) ब्राउज़र மதிப்பை வைத்திருக்கிறது; நீங்கள் ref மூலம் தேவைப்படும்போது மட்டுமே அதை படிக்கிறீர்கள்: ```jsx const inputRef = useRef(null); ; // on submit: const value = inputRef.current.value; ``` ## எதை எப்போது பயன்படுத்த வேண்டும் - **கட்டுப்படுத்தப்பட்ட**: பெரும்பாலான படிவங்கள் — நீங்கள் சரிபார்க்க, நிபந்தனைக் கண்ணோட்டம் மற்றும் ஒரே உண்மையின் மூலம் பெறுகிறீர்கள்.缺点 என்பது விசைஅழுத்தத்திற்கு ஒரு மறுசெய்கை (பொதுவாக சிறிய தாக்கம்). - **கட்டுப்படுத்தப்படாத**: எளிய படிவங்கள், கோப்பு உள்ளீடுகள் (`` எப்போதும் கட்டுப்படுத்தப்படாதது), அல்லது गैर-React விசைப்பெட்டிகளை ஒருங்கிணைப்பது. குறைந்த குறியீடு, ஆனால் நீங்கள் மாற்றங்களை பிரতিক্रியা செய்ய முடியாது. அவற்றை கலக்குதல் (`value` மற்றும் `defaultValue` இரண்டையும் அனுப்புதல்) ஒரு பொதுவான பிழை மற்றும் React எச்சரிக்கையைத் தூண்டுகிறது.