2017-10-08 1 views
0

J'essaie de transmettre un argument à ma fonction mais à chaque fois que je charge la page, cette commande est appelée. J'ai aussi essayé() => this.loadStories ('bloomberg') mais cela ne semble pas fonctionner. voici mon code.React Native onPress est en cours de chargement

class Main extends Component { 

constructor() { 
    super(); 
    this.loadStories = this.loadStories('channel').bind(this); 
} 

componentDidMount(){ 

} 

loadStories(channel) { 
    this.props.getStories(channel); 
} 

render() { 
    return (
    <ScrollView> 
     <View style={{marginTop: 20}}> 

     <Button onPress={this.loadStories('bloomberg')} title="Top Stories"></Button> 


     {this.props.stories.map(function(item, index){ 
     return(
      <View key={index} style={{marginBottom: 10, padding: 10}}> 
      <Text>{item.title}</Text> 
      <Text>{item.description}</Text> 
      </View> 
     ) 
     })} 
    </View> 

    </ScrollView> 
); 
} 
} 
+0

modifier pour qu'il: 'onPress = {() => this.loadStories ('bloomberg')} 'pour empêcher l'invocation immédiate – Cherniv

Répondre

1

Vous pouvez faire ce qui suit pour éviter le problème d'invocation méthode immédiate (fonction) vous avez:

class Main extends Component { 
    constructor() { 
    // Step #1: Delete this line. You can't bind like this. 
    // this.loadStories = this.loadStories('channel').bind(this); 
    } 

    /* ... */ 

    render() { 
    return (
     <ScrollView> 
     <View style={{marginTop: 20}}> 
      { /* Step #2: bind inline and pass 'bloomberg' like so: */ } 
      <Button onPress={this.loadStories.bind(this, 'bloomberg')} title="Top Stories"> 
      </Button> 
     </View> 

     { /* ... */ } 
     </ScrollView> 
    ); 
    } 
}