React envuelve los eventos nativos del navegador en un objeto multinavegador llamado SyntheticEvent y usa un único listener en la raíz de la aplicación para despachar los eventos hacia tus manejadores (delegación de eventos). Tú solo adjuntas los manejadores como props.
<button onClick={e => { e.preventDefault(); save(); }}>Save</button>
onClick, onChange, onSubmit) y reciben una función, no una cadena de texto (onClick={handleClick}, no onClick="handleClick()").e.preventDefault(), e.stopPropagation(), e.target.No llames la función mientras renderizas; envuélvela para que se ejecute con el evento, no de inmediato:
<button onClick={() => remove(id)}>Delete</button> // ✅ runs on click
<button onClick={remove(id)}>Delete</button> // ❌ runs during render!
La segunda línea llama a remove(id) mientras se construye el JSX (en cada render), lo cual casi nunca es lo que quieres.
Para los formularios, prefiere onSubmit en el <form> (con preventDefault) en lugar de onClick en el botón, para que la tecla Enter también funcione.
Una biblioteca de preguntas de entrevista de IT con respuestas detalladas — de Junior a Senior.
Donar