web-dev-qa-db-fra.com

réagir nativement comment appeler plusieurs fonctions lorsque l'on clique sur onPress

J'essaie d'appeler plusieurs fonctions lorsque je clique sur onPress à l'aide de TouchableOpacity

Par exemple:

functionOne(){
// do something
}

functionTwo(){
// do someting
}

<TouchableHighlight onPress{() => this.functionOne()}/>

Que faire si je veux appeler deux fonctions lorsque l'on clique sur onPress? Existe-t-il un moyen d'appeler plusieurs fonctions?

javascriptreactjsreact-native
6
kirimi

Il existe plusieurs moyens d'y parvenir. Une option serait de définir une fonction qui appelle functionOne et functionTwo, et de la transmettre à votre gestionnaire onPress comme ceci:

functionOne(){
// do something
}

functionTwo(){
// do something
}

functionCombined() {
    this.functionOne();
    this.functionTwo();
}

<TouchableHighlight onPress={() => this.functionCombined()}/>

Alternativement, et de manière plus concise, vous pouvez exprimer functionCombined inline dans votre JSX comme ceci:

functionOne(){
// do something
}

functionTwo(){
// do someting
}

<TouchableHighlight onPress={() => { this.functionOne(); this.functionTwo(); }/>
5
Dacre Denny

Vous pouvez également le faire avec une valeur booléenne. Exemple ;

<TouchableHighlight onPress{() => { this.functionOne() || this.functionTwo()}}/>
2
GuestReact

En cherchant votre commentaire, vous ne souhaitez pas utiliser la flèche, je vous suggère donc d'utiliser quelque chose comme ceci:

functionOne(){
// do something
}

functionTwo(){
// do someting
}

mixFunction=()=>{
functionOne();
functionTwo();
}

mixFuncWithoutArrow(){
functionOne();
functionTwo();
}

<TouchableHighlight onPress{this.mixFunction() || this.mixFuncWithoutArrow.bind(this)}/>
1
flix

Vous pouvez utiliser ces accessoires:

onPress Appelé lorsque le toucher est relâché

onPressIn Appelé dès que l'élément tactile est pressé et appelé avant onPress.

<TouchableWithoutFeedback
    onPress={() => {
      function1(square);
    }}
    onPressIn={() => {
      this.function2();
    }}
 >
1
Kailash Uniyal