Question

我尝试使用onPress单击TouchableOpacity时调用多个功能

例如：

functionOne(){
// do something
}

functionTwo(){
// do someting
}

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

如果我想在单击onPress时调用两个函数怎么办？有没有办法我可以调用多个函数？

Answer 1

有几种方法可以实现这一目标。一种选择是定义一个调用functionOne和functionTwo的函数，并将其传递给onPress处理程序，如下所示：

functionOne(){
// do something
}

functionTwo(){
// do someting
}

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

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

或者更简洁地，您可以像这样在JSX中内联表达functionCombined：

functionOne(){
// do something
}

functionTwo(){
// do someting
}

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

Answer 2

寻求评论，您不想使用箭头，所以我建议使用这样的东西：

functionOne(){
// do something
}

functionTwo(){
// do someting
}

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

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

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

Answer 3

您可以使用以下道具：

onPress 在触摸释放时调用

onPressIn 在onPress之前按下并调用可触摸元素时立即调用。

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

Answer 4

如果要调用一个函数然后导航到屏幕，请按照这种方式进行。

<TouchableOpacity onPress={() => { this.onSubmit(); this.props.navigation.navigate('NextScreen') }}>

Answer 5

您也可以使用布尔值来实现。示例；

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

Answer 6

我认为这很简单，我们在函数之间只使用 PLUS '+' :

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

Answer 7

我们也可以从第一个方法中调用第二个方法，就像这样......

functionOne(){
 // do something
 functionTwo();
}

functionTwo(){
 // do someting
}

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

Answer 8

<Button 
onPress={() =>{
onIncrease();
show();
}}
 title={`Increase ${color}`}
/>`enter code here`

反应本地如何单击onPress时调用多个功能

8 个答案: