反応するネイティブのListViewデータソースのTouchableハイライトを使用する

Question

私は、サーバーへの残りの呼び出しからデータソースを取得するデータソースでListViewを使用しています。

renderRow(rowData){ 
    var imageURL = rowData.banner; 

    return (
     <View> 
     <Text >{rowData.name}</Text> 
     <Image 
      style={{width: 80, height: 80}} 
      source={{uri: imageURL, width: 400, height: 400}} 
     /> 
     </View> 
    ); 
    } 

    render() { 
    return (
     <View> 
      <ListView 
      enableEmptySections 
      dataSource={this.state.dataSource} renderRow={this.renderRow.bind(this)} 
      style={styles.listview}/> 

     </View> 
)} 

ここで、データソースのデータのrenderRow関数でレンダリングされたビューにボタンプレス効果を追加します。そして私はこれに私のコードを変更しました。

 renderRow(rowData){ 
     var imageURL = rowData.banner; 

     return (
     <TouchableHighlight style={ this.state.pressStatus ? styles.buttonPress : styles.button } 
          onPress={this._changeStyleAndNavigate.bind(this)}> 
      <View> 
      <Text >{rowData.name}</Text> 
      <Image 
       style={{width: 80, height: 80}} 
       source={{uri: imageURL, width: 400, height: 400}} 
      /> 
      </View> 
</TouchableHighlight> 
     ); 
     } 

    _changeStyleAndNavigate() { 
    this.setState({ pressStatus: true }); 

    } 

このTouchableHighlight Viewには、色が異なる2つのスタイルがあります。ユーザーがTouchableHighlightビューにタッチすると、色を変えてこのようにしてボタンを押す感触を与えます。

しかし、私の問題は、ListViewに複数の行がある場合、1行を押すとすべての行（TouchableHighlightビュー）の色が変わるということです。

だから、各行にIDを与え、そのIDに基づいて色を変える方法はありますか？

Answer 1

あなたの問題の方法は、より簡単に解決するためにRNのドキュメントを参照してください：https://facebook.github.io/react-native/docs/touchablehighlight.html

underlayColorと呼ばれるコンポーネントプロパティがあります。それに価値を与えてください（アイテムが押されたときに見たい色）。したがって、コンポーネントは次のようになります。

<TouchableHighlight style={styles.button} underlayColor={'#ff0000'}>