2016-03-10 1 views
0

s'il vous plaît vérifier le code de suivi:React Native - setState Avertissement sur le deuxième montage

componentDidMount() { 
    /* 
    * Add listener 
    * The User has search for a team 
    */ 
    teamStore.addChangeListener("SEARCH_TEAMS", this.updateTeams.bind(this)); 
} 

componentWillUnmount() { 
    /* 
    * Remove Listener and clear the Store 
    */ 
    teamStore.removeChangeListener("SEARCH_TEAMS", this.updateTeams); 
    teamStore.resetTeams(); 
} 

/* 
* The API has find some new teams 
* Update the state and show the new teams in the listview 
*/ 

updateTeams() { 
    var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); 
    this.setState({dataSource: ds.cloneWithRows(teamStore.getAllTeams())}); 
} 

Info: Le SEARCH_TEAMSEvent est déclenchée par un autre Component.

Si je rends le composant pour la première fois, tout fonctionne correctement. Mais si je pop la page et de naviguer à nouveau sur cette page je suis arrivé cet avertissement:

Attention: setState (...) ne peut mettre à jour un composant monté ou montage ...

Répondre

1

Vous ne l'avez pas bien clair votre écouteur d'événement, puisque différentes références de fonctions ont été données. Cela permet à votre écouteur d'événement de continuer à écouter et setState y est appelé.

Voici une solution:

componentDidMount() { 
    // Save the function you want to listen with so you can remove it later 
    this.updateTeamsBound = this.updateTeams.bind(this); 
    teamStore.addChangeListener("SEARCH_TEAMS", this.updateTeamsBound); 
} 

componentWillUnmount() { 
    teamStore.removeChangeListener("SEARCH_TEAMS", this.updateTeamsBound); 
    teamStore.resetTeams(); 
}