Long press event fires even when mouse moves (Ionic React)

Asked Aug 25 '20 at 11:50

Active Aug 25 '20 at 11:50

Viewed 218 times

I have a list of items. I want to be able to handle both an onClick and onLongPress events. For this purpose, I am using this hook here.

My issue is that on mobile when you start to press on the item, but them move your finger out of the "hitbox" (finger no longer on the item), this will still trigger a onLongPress event. Expected behaviour is that the user should keep their finger on the item when long pressing, and only then should the event trigger.

I found this library which doesn't have this issue but ONLY works on mobile, and I'm trying to make my app compatible with all platforms, including the browser (as a PWA): this one

Any sort of advice on how to move forward would be greatly appreciated.

asked Aug 25 '20 at 11:50

caleidon

try using ion-sliding Items – Najam Us Saqib Aug 25 '20 at 13:02
@NajamUsSaqib still the same issue... – caleidon Aug 25 '20 at 14:14
why are you using `LongPress`? please explain Use Case – Najam Us Saqib Aug 25 '20 at 15:35
I am using it to select items. (which are notes). On click, a note opens, and when long pressed, they are added to the list of selected notes. Pretty standard behavior. – caleidon Aug 25 '20 at 18:35
That's why i suggested you ion- sliding. You can slide an item to add them on list and click to open it. https://ionicframework.com/docs/api/item-sliding – Najam Us Saqib Aug 25 '20 at 20:17
Aha, I misunderstood you. I do not like this approach because most apps use long press to select, so this is just avoiding the issue. – caleidon Aug 28 '20 at 12:02
Basically Gmail and other Emails apps and many other apps are using this approach. So i think its a better User Experience. – Najam Us Saqib Aug 28 '20 at 19:37

Long press event fires even when mouse moves (Ionic React)

0 Answers0