Le gestionnaire tactile n'est pas appelé avec React Native

Question

Je viens de commencer à apprendre React Native et j'ai couru ceci: J'ai créé un composant qui a un TouchableHighlight dedans, et j'ai assigné une fonction de gestionnaire, mais il ne semble pas ça s'appelle. Voici mon élément:

import React, {Component} from 'react'; 
import { 
    Text, 
    View, 
    TouchableHighlight 
} from 'react-native'; 

export default class Component1 extends Component<{}> { 
    componentWillMount() { 
     console.log("hi there"); 
     this.setState({age: 22}); 
    } 

    handlePress() { 
     this.setState(prevState => ({ age: prevState.age + 1 })); 
     console.log("updated age"); 
    } 

    render() { 
     return (
      <View> 
       <View> 
        <Text> 
         {this.props.name} 
         {"\n"} 
         {this.state.age} 
        </Text> 
       </View> 
       <View> 
        <TouchableHighlight onPress={() => this.handlePress}> 
         <View> 
          <Text>Become older</Text> 
         </View> 
        </TouchableHighlight> 
       </View> 
      </View> 
     ); 
    } 
} 

Quand je tape le « devenir plus » rien de vue est connecté à la borne (j'utilise react-native log-android

Merci pour aider à :)

Answer 1

A l'intérieur du onPress, il devrait être une fonction. Vous utilisez la fonction de flèche, vous devez appeler la fonction handlePress:

Cette partie:

<TouchableHighlight onPress={() => this.handlePress}> 

devrait être:

<TouchableHighlight onPress={() => this.handlePress()}> 

Mais si vous êtes juste d'appeler la fonction, de sorte que vous venez besoin de le transmettre comme:

<TouchableHighlight onPress={this.handlePress}> 

Answer 2

Vous. avoir une erreur de syntaxe.

<TouchableHighlight onPress={() => this.handlePress}> 

devrait être

<TouchableHighlight onPress={() => this.handlePress()}> 

ou

<TouchableHighlight onPress={this.handlePress}>