React Native TouchableHighlight onPress not working

Question

I have tried everything to make this work. I have read all the answers and it never works for me. I am completely out of ideas.

Here is the function I am trying to call:

function handlePress() {
    console.log('test');
}

Here is what I have tried:

This one does nothing:

<TouchableHighlight
    onPress={() => { alert('You tapped the button!') }}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

This one triggers without me doing anything:

<TouchableHighlight
    onPress={alert('You tapped the button!')}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

This one triggers without me doing anything:

<TouchableHighlight
    onPress={handlePress()}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

This one does nothing:

<TouchableHighlight
    onPress={() => {() => handlePress()}}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

This one does nothing:

    <TouchableHighlight
    onPress={() => handlePress()}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

This one does nothing:

<TouchableHighlight
    onPress={handlePress}>
  <Text style={ styles.sendButton }>Test Touch</Text>
</TouchableHighlight>

Can anyone help?

Answer 1

  <TouchableHighlight style={{backgroundColor: 'yellow'}}
   onPress={()=> {alert('You tapped the button!')}}>
  <Text style={{color: '#000', textAlign: "center", fontSize: 40}}>Test Touch</Text>
  </TouchableHighlight>

I just tried this one myself and it works. I didn't see a difference with your code, so I copied yours, tried and it worked. Are you sure you didn't mess up the CSS style making it unreachable?

I would isolate the button in some screen and try it alone.

Answer 2

I had done everything the same as you have. Only I have heavily relied on auto-import of VS code that TouchableHighlight was auto imported from react-native-gesture-handler rather it should be imported from react-native lib.

I changed it to react-native and it is working fine.

Wrong

Corrected