Q1. How is event handling different in React compared to plain HTML?
In React, events are named using camelCase (onClick instead of onclick), and you pass a function as the event handler (not a string). React also uses a synthetic event system to ensure cross-browser compatibility.
Q2. How do you handle a click event in a functional component?
Define a function inside the component and attach it to the onClick attribute. Example: function handleClick() { alert('Clicked'); } return ;. You can also use inline arrow functions: onClick={() => alert('Clicked')}.
Q3. How do you pass arguments to event handlers?
You can use an arrow function: onClick={() => handleClick(id)}. Or use the bind method: onClick={handleClick.bind(this, id)}. Arrow functions are more common because they are concise and avoid 'this' binding issues.
Q4. What is the event object in React?
The event object is a synthetic event wrapper that has the same properties as native events but works consistently across browsers. It is passed to the event handler automatically. For example, onClick={(e) => console.log(e.target)}.
Q5. How do you prevent default behavior in React?
Call e.preventDefault() on the event object. In React, returning false does not prevent default; you must explicitly call preventDefault. Example: function handleSubmit(e) { e.preventDefault(); }