React नेटिव ब्राउজर इव्हेंट्स को SyntheticEvent नामक क्रॉस-ब्राउजर ऑब्जेक्टमध्ये लपवते आणि अॅप्लिकेशनच्या रूटवर एकच श्रोता वापरून आपल्या हॅंडलर्सला इव्हेंट्स पाठवते (event delegation). आपल्याला फक्त हॅंडलर्स props म्हणून जोडायचे असतात.
<button onClick={e => { e.preventDefault(); save(); }}>Save</button>
सविस्तर उत्तरांसह IT मुलाखत प्रश्नांचे ग्रंथालय — Junior पासून Senior पर्यंत.
देणगी द्याonClick, onChange, onSubmit) आणि फंक्शन घेतात, स्ट्रिंग नाहीत (onClick={handleClick}, onClick="handleClick()" नाहीत).e.preventDefault(), e.stopPropagation(), e.target.रेंडर करण्यावेळी फंक्शन कॉल करू नका — हे गोंद करा म्हणजे हे इव्हेंटवर चालू होईल, लगेचच नाहीत:
<button onClick={() => remove(id)}>Delete</button> // ✅ runs on click
<button onClick={remove(id)}>Delete</button> // ❌ runs during render!
दुसरी लाइन JSX बनवताना remove(id) कॉल करते (प्रत्येक रेंडरमध्ये), जे जवळजवळ कधीच व्हायचे नाही.
फॉर्मसाठी, बटणावर onClick ऐवजी <form> वर onSubmit (की preventDefault) पसंत करा, जेणेकरून Enter कुंजी देखील कार्य करेल.