What is the best way to check if a given object of any kind is a SyntheticEvent?
Currently, I'm peering into the internals:
if (obj.nativeEvent ) {
// 100% sure...with this version of React
}
What is a more idiomatic (or at least future-proof) way of doing this?
Your event handlers will be passed instances of SyntheticEvent , a cross-browser wrapper around the browser's native event. It has the same interface as the browser's native event, including stopPropagation() and preventDefault() , except the events work identically across all browsers.
React onClickCapture is an event handler that gets triggered whenever we click on an element. like onclick, but the difference is that onClickCapture acts in the capture phase whereas onClick acts in the bubbling phase i.e. phases of an event.
event.stopPropagation() This will stop any parent component's event from firing. To use this: Make sure to pass the event object as a parameter. Use the stopPropagation method on the event object above your code within your event handler function.
You can use such check: if (!(event instanceof Event))
.
event
(which is SyntheticEvent
) will give false
in this case and event.nativeEvent
will give true
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With