I am working on an onPress event in React Native. I have added two different actions onPress, onLongPress. I have two different functions associated with each of them. Now i have also added delayLongPress={250} and it's working with onLongPress. But when i try to call the onLongPress, it calls the onPress too. I don't want that to happen. I want to call the onpress when it's pressed just once and onLongPress when it's pressed for 250ms at least. How can i seperate those function calls.
Here's what i have right now:
const onLongPress = () =>{
console.log('Pressed long')
}
const onChange = () =>{
console.log('Pressed')
}
return(
<Container
onPress={onChange}
onLongPress={onLongPress}
delayLongPress={250}
>
</Container>
)Try to wrap it with the TouchableHighlight.
export default function App() {
const onLongPress = () => {
console.log('Pressed long');
};
const onChange = () => {
console.log('Pressed');
};
return (
<TouchableHighlight
onPress={onChange}
onLongPress={onLongPress}
delayLongPress={250}
>
<Text>Press</Text> // Your child components goes here
</TouchableHighlight>
);
}
See the snack here