FlatList ne se réaffiche pas jusqu'à ce que la liste défile

Question

J'ai un FlatList qui provient d'un tableau défini dans l'état de la vue. La liste est filtrée en filtrant le tableau d'origine et en définissant le tableau dans l'état avec le nouveau tableau filtré. Mais le re-rendu n'est appelé que lorsque la liste est défilée. Existe-t-il un moyen de forcer le ré-affichage des listes de lecture?

import setsArr from '../../json/sets'; 
. 
. 
. 
constructor (props) { 
    super(props); 
    this.state({ 
    arrToDisplay: setsArr, 
    }); 
} 
. 
. 
. 
_filter = (filter,value) => { 
    var newArr = setsArr.filter(function(){ 
       return (el.filter === value) 
       }); 
    this.setState({ 
    arrToDisplay: newArr, 
    }); 
} 

renderOption = (data) => { 
    return (
    <Text>{data.item.name}</Text> 
); 
} 
render() { 
    return (
     . 
     . 
     . 
     <FlatList 
     data={this.state.arrToDisplay} 
     renderItem={(item) => this.renderOption(item)}}/> 
     . 
     . 
    ); 
} 

Answer 1

J'ai trouvé avec ListView, FlatList et SectionList, que les changements à la source de données ne rendu lorsque la FlatList avait une clé unique.

Je serai heureux si quelqu'un poste une réponse correcte, mais c'est ce que je fais maintenant:

<FlatList 
    key={"mylist" + hashOfDataSourceObj} 
    ... 

voir https://stackoverflow.com/a/31481960/7223