Question

我不明白为什么第一个代码示例将按钮的onPress呈现为ok，而另一个示例当我将其放入底部时却无法识别该功能。

//This executes as expected

 render() {
   return (

     <View style={styles.container}>

       <TouchableOpacity onPress={this.handlePress.bind(this)}>

          <Text style={{paddingTop: 10, paddingLeft: 10, color: 
         '#FF0000'}}>Prova</Text>

       </TouchableOpacity>

     </View>

-------------------------------------------------------------------
//Here it can't recognise the function

func1(){
 this.handlePress.bind(this);
 };


 render() {
   return (

     <View style={styles.container}>

       <TouchableOpacity onPress={this.func1()}>

          <Text style={{paddingTop: 10, paddingLeft: 10, color: 
         '#FF0000'}}>Prova</Text>

       </TouchableOpacity>

     </View>

Answer 1

将您的函数转换为箭头函数，而无需绑定... 箭头功能自动绑定到其父级...

handlePress = () => {};

-

<TouchableOpacity onPress={this.handlePress}>

Answer 2

您不需要绑定this.handlePress.bind（this）;在func1内部。

只需调用

func1(){
    this.handlePress()
}

使用this.handlePress.bind（this），您无需调用函数，而只是将函数bounfd返回到'this'

在TouchableOpacity函数“ onPress”上无法识别的React Native函数

2 个答案: