をクリック項目の後FlatListでネイティブの変更色に一つの項目を反応させる（のようなInstagramの）

Question

が反応ネイティブ変色つの項目は

<FlatList 
     data={this.state.posts} 
     renderItem={this.renderItem.bind(this)} 
     keyExtractor={(item, index) => index} 
     ListEmptyComponent={()=> <Spinner />} 
     onEndReached={this.handleLoadMore.bind(this)} 
     onEndReachedThreshold={0.5} 
     initialNumToRender={1} 
/> 

後の項目と色が変化した項目のリストをクリックしてレンダリング：

renderItem({item}){ 
return (
<Button transparent> 
    <TouchableOpacity 
     onPress={()=>this.likeSave(item.id) } 
    > 
    <Icon name="heart" size={30} style={{color:likeColor}} /> 
    </TouchableOpacity> 
</Button> 
} 

アイコンをクリックするとアイコンが変わります。アイコンの心臓は赤色になります

Answer 1

私は何かを働かせることができます。あなたは、各プレス

にisClicked値を更新する必要があり、その後のRenderItemにuは

renderItem({item}){ 
return (
<Button transparent> 
    <TouchableOpacity 
     onPress={()=>this.likeSave(item.id) } 
    > 
    <Icon name="heart" size={30} style={{color:item.isClicked ? likeColor : normalColor}} /> 
    </TouchableOpacity> 
</Button> 
} 

likeSave()方法のようなチェックを行うことができます

[{name:'ItemOne', isClicked:false},{name:'ItemTwo', isClicked:false},...]. 

のようなデータソースを使用する必要があります