OnPress in ReactNative verschachtelte Komponente

kann nicht ausgeführt werden, so dass ich native reactive verwenden und nicht die Funktion onPress aufgerufen werden kann. Ich habe eine SearchUser Komponente, die eine Render-Methode hat, in dem ichOnPress in ReactNative verschachtelte Komponente

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

Jetzt genannt haben die Benutzeranzeigen ist wie folgt

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); 
}

Wenn ich auf das Symbol klicken ich folgende errror undefined erhalten, ist kein Funktion (Bewertung this.followThem (user.id))

Soweit ich verstehe, ist der Wert dieser undefined aber ich habe Funktionen wie die unten in meiner SearchUser-Komponente verwendet. Welche ruft die Funktion richtig

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

Ich habe auch versucht this.followThem.bind (this, user.id), aber ohne Erfolg, was ich falsch tue?

Quelle

2017-03-07 blaziken105

Eine vereinfachte Antwort -

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

Hinweis auf den Pfeil Funktion in map verwendet. Es bindet automatisch this an Callback.

Sie können auch tun -

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

Quelle

2017-03-07 11:42:40 vinayr

Dank das funktioniert !! – blaziken105

OnPress in ReactNative verschachtelte Komponente

Antwort

Verwandte Themen