cannot pass useGestureHandlerRef to Gesture.Simultaneous undefined is not a function
See original GitHub issueDescription
Before the recent API updates passing the ref of a useGestureHandlerRef to simultaneousHandlers worked. In 2.4 the app crashes with a undefined is not a function
USED TO WORK
import { useGestureHandlerRef } from '@react-navigation/stack'
const MyComponent = () => {
const cardGestureHandlerRef = useGestureHandlerRef()
return (
<PanGestureHandler
simultaneousHandlers={cardGestureHandlerRef} //< --- this used to work
>
...
DOESNT WORK
import { useGestureHandlerRef } from '@react-navigation/stack'
const MyComponent = () => {
const cardGestureHandlerRef = useGestureHandlerRef()
const gesture = Gesture.Pan()
const simultaneousHandlers = Gesture.Simultaneous(
gesture,
cardGestureHandlerRef //<--- this crashes the app
)
return (
<GestureDetector gesture={simultaneousHandlers}>
...
Platforms
- [ X] iOS
- Android
- Web
Screenshots
Steps To Reproduce
https://gist.github.com/haibert/c99861f8c02e7e0b701c83ff2b2317ff
Expected behavior
I want to pass the gestures to the navigation card using the simultaneous gesture handing
Actual behavior
the app crashes with a undefined is not a function
Snack or minimal code example
https://gist.github.com/haibert/c99861f8c02e7e0b701c83ff2b2317ff
Package versions
"react-native-gesture-handler": "2.4",
"@react-navigation/stack": "^6.2.1",
"react-native-reanimated": "~2.8.0",
Issue Analytics
- State:
- Created a year ago
- Comments:10 (6 by maintainers)
Top Results From Across the Web
Can't Get Simultaneous Gesture Recognition to Work
I'm trying to configure an app that simultaneously allows taps and long presses. ... The gestureRecognizer function apparently never gets called by the ......
Read more >React Native Gesture Handler shows: undefined is not an object
I am using react-native-gesture-handler: 1.3.0. My. TypeError: Undefined is not an object (evaluating 'rectEvt[mappingKey]'). Please see the ...
Read more >Pan gesture | React Native Gesture Handler - Software Mansion
A continuous gesture that can recognize a panning (dragging) gesture and track its movement. The gesture activates when a finger is placed on...
Read more >Troubleshooting - React Navigation
I'm getting an error "TypeError: Cannot read property 'bind' of undefined" or "TypeError: propListener.apply is not a function".
Read more >react-native-gesture-handler - npm
Start using react-native-gesture-handler in your project by running ... It makes touch interactions and gesture tracking not only smooth, ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
The migration guide covering the most important changes is here: https://docs.swmansion.com/react-native-gesture-handler/docs/guides/upgrading-to-2 🎉 .
@haibert It’s hard to tell at the moment, as we would have to implement the entire mechanism from scratch. You can, since you’re already using Reanimated, use the touch events and the state manager to accomplish something similar, although with more work. Here’s a simple example of them. You can track all pointers separately and control the state of the gesture manually.
As for the upgrade guide, it may be a good idea. I’ll talk with the team about what it may look like.