Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Why is `preventDefault` not made available on press events?

See original GitHub issue

❔ Question

Why is preventDefault not available in PressEvent?

🔦 Context

I’m replacing the guts our of style system with react-spectrum and ran into an incompatibility with our codebase because preventDefault is not in onPress from useButton (or usePress).

There’s a few use cases. First, we have clickable rows in a list that have a delete button inside of them. The delete button needs to prevent the default so the row itself won’t navigate away.

💻 Code Sample

🌍 Your Environment

Software	Version(s)
react-spectrum	v3.1
Browser	Chrome Mac
Operating System

🧢 Your Company/Team

Apollo GraphQL 🚀

Issue Analytics

State:
Created 3 years ago
Reactions:2
Comments:18 (11 by maintainers)

Top GitHub Comments

9reactions

GriffinSaucecommented, Mar 15, 2021

It would be helpful to at least add this to the documentation. preventDefault is very commonly used - being directed to use a deprecated function to solve it is not great but it would be nice to at least have this limitation front and center so it’s not a surprise that requires a roundtrip to this issue.

I have a similar use case, an <a> link with a click handler. The click handler facilitates better in-context UX and the link facilitates opening the feature in a tab. That pattern may not be super common but in the past years I have had to reach for it several times to reach the desired outcome.

Instead of providing the preventDefault to the event handler it could potentially also be an option on the hook, that would allow you to handle it consistently internally, whatever the mix of events is that is required to build onPress.

1reaction

jrmyiocommented, Mar 4, 2021

I have a link button with an onPress, I want the link to be just there but customize what happends when it is clicked.

Is there any way to prevent the default link behavior?

Top Results From Across the Web

Event.preventDefault() - Web APIs | MDN

The preventDefault() method of the Event interface tells the user agent that if the event does not get explicitly handled, its default ......

e.preventdefault(); not working - Stack Overflow

My problem was simply that another click event was being binded to the element at a later point in the script, overwriting the...

How to correctly use preventDefault(), stopPropagation(), or ...

Here we have taken the click event and prevented its default behaviour using event.preventDefault() , then invoked the fileUpload() function ...

jQuery event.preventDefault() Method - W3Schools

The event.preventDefault() method stops the default action of an element from happening. For example: Prevent a submit button from submitting a form ...

event.preventDefault() | jQuery API Documentation

event.preventDefault()Returns: undefined. Description: If this method is called, the default action of the event will not be triggered.