What are synthetic events in react??

Forums ReactWhat are synthetic events in react??
Staff asked 2 years ago

Answers (1)

Add Answer
Jaydip Mali Marked As Accepted
Staff answered 2 years ago

SyntheticEvent, a cross-browser wrapper around the browser’s native event, will be supplied to your event handlers. It provides the same user interface as the browser’s native event, including stopPropagation()and preventDefault(), with the exception that the events operate in all browsers.

If you require the underlying browser event for any reason, simply utilise the nativeEventattribute to obtain it. The synthetic events are distinct from the browser’s native events and do not map directly to them. OnMouseLeave event.nativeEvent, for example, will point to a mouseoutevent. The mapping is not part of the public API and is subject to change at any time.

The following properties are present in every SyntheticEventobject:

boolean bubbles
boolean cancelable
DOMEventTarget currentTarget
boolean defaultPrevented
number eventPhase
boolean isTrusted
DOMEvent nativeEvent
void preventDefault()
boolean isDefaultPrevented()
void stopPropagation()
boolean isPropagationStopped()
void persist()
DOMEventTarget target
number timeStamp
string type

Note:As of v17, e.persist() doesn’t do anything because the SyntheticEvent is no longer pooled.

Note:As of v0.14, returning false from an event handler will no longer stop event propagation. Instead, e.stopPropagation() or e.preventDefault() should be triggered manually, as appropriate.

 

Subscribe

Select Categories