無法在ReactNative嵌套組件中執行onPress

因此，我正在使用react native並且無法獲取要在onPress上調用的函數。我有其中有一個渲染方法中，我已經叫無法在ReactNative嵌套組件中執行onPress

<ShowUsers allUsers={this.state.details} access_token={this.state.access_token}/>

現在ShowUsers如下：一SearchUser組件

class ShowUsers extends Component{ 
.... 
render(){ 
var user = this.state.details; 
var userList = user.map(function(user,index){ 
     var img={ 
     uri:user.avatar.uri, 
     } 
     return(
     <ListItem icon key={ index }> 
       <Left> 
       <Thumbnail small source={img} /> 
       </Left> 
       <Body> 
       <Text>{"@"+user.uname+" "+user.id}</Text> 
       <Text note>{user.fname+" "+user.lname}</Text> 
       </Body> 
       <Right> 
        <Icon style={{fontSize:30}} name="ios-add-circle" onPress={this.followThem(user.id).bind(this)} /> 
       </Right> 
      </ListItem> 
     ); 
     }); 
     return(
     <View> 
     {userList} 
     </View>); 
    } 

followThem(userId){ 
    Alert.alert("userId "+userId); 
}

當我點擊我得到以下errror圖標不確定是不是函數（評估this.followThem（user.id））

據我瞭解，這是未定義的價值，但我已經使用函數，如下面在我的SearchUser組件。它調用函數正確

<Icon onPress={this.goBack.bind(this)} name="arrow-back" />

我自己也嘗試this.followThem.bind（這一點，user.id），但無濟於事我究竟做錯了什麼？

來源

2017-03-07 blaziken105

簡化答案 -

render() { 
    var user = [11,22,33]; 
    var userList = user.map((u,i) => { 
     return(
     <Text key={i} onPress={this.followThem.bind(this, u)}>{u}</Text> 
    ); 
    }); 
    ..... 
    }

通知在map使用箭頭功能。它會自動將this綁定到回調。

你也可以做 -

<Text key={i} onPress={() => this.followThem(u)}>{u}</Text>

來源

2017-03-07 11:42:40 vinayr

感謝這個作品！ – blaziken105

無法在ReactNative嵌套組件中執行onPress

回答

相關問題