question-mark
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.

onPress events don't work with custom toast components

See original GitHub issue

whether using BaseToast or my own component with TouchableOpacity, the onPress events are not firing. I think this is probably to do with the PanResponder in the root component. can anyone help?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:11 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
JamesPerlmancommented, Dec 15, 2020

For a quick & dirty fix, src/index.js can be changed like so. change the onMoveShouldSetPanResponder function to be something like this:

onMoveShouldSetPanResponder: (event, gestureState) => {
     const { dx, dy } = gestureState;
     return Math.abs(dx) > 1 || Math.abs(dy) > 1;
}
1reaction
RichMatthewscommented, Mar 7, 2021

this is still broken for me. the src/index.js has this in it:

function shouldSetPanResponder(gesture) {
  const { dx, dy } = gesture;
  // Fixes onPress handler https://github.com/calintamas/react-native-toast-message/issues/113
  return Math.abs(dx) > 2 || Math.abs(dy) > 2;
}

did it change back?

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to create a custom toast component with React
Go into your toast component. On the button, add an onClick with a method called deleteToast , which takes a toast ID as...
Read more >
ReactJS: Why is my custom functional toast component ...
First problem that I see with your code is that you are keeping two sources of truth for toast list. One is passed...
Read more >
Create custom toast components with React
In this tutorial, I will show you how to use React to create a custom toast component as well as React hooks such...
Read more >
Toast Messages in React Native: A Step-by-Step Guide - Waldo
A built-in component shows toast messages in Android. However, we need to write custom code to show toast messages in the iOS platform....
Read more >
ShowToastEvent notification is not displayed in LWC
So what usually happens with toast events? · You dispatch an event which is most probably set to propagate outside shadow DOM boundary...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found