Question

以下是我的列表视图的代码，基本上它是一个新闻列表：

 <TouchableHighlight
    onPress={this.changeTextColor.bind(this)}
    underlayColor={"#E8E8E8"}
    style={[styles.button]}>
    <View style={styles.news_item}>
      <Text style={[styles.news_item_text,{color:this.state.color}]}>{news.title}</Text>
    </View>
  </TouchableHighlight>

changeTextColor(){
   console.log('clicked');
   this.setState({
    color: '#ffffff'
    });
 }

我试图做的是点击新闻项后，文本颜色将通过changeTextColor（）更改。

不知何故，颜色不会改变，任何想法？

Answer 1

您可以在此处找到您要做的事情的示例...... https://github.com/VctrySam/Pokemon/blob/master/app/components/pokedex.js

这是一个演示视频。看看第二个29周围的Pokedex部分 https://www.youtube.com/watch?v=RG6FFL2ny3s&feature=youtu.be

这里他定义了他的列表视图（see actual code）......

  <ListView
      bounce = {false}
      style = {{flex:1, marginBottom:30 }}
      dataSource = {this.state.dataSource}
      renderRow = {(rowData) => this.balls(rowData)} />

请注意renderRow调用this.balls(rowData)传递rowData，用于构建视图，具体取决于是否选择了行（或球）。（See actual code）

  balls(x){
      if(!x.selected){
        return(
          <View>
             // row definition if NOT selected
          </View>
        )
      } else {
        return(
          <View>
             // row definition if IS selected
          </View>
        )
      }
  }

标记项目在Listview中读取React Native

1 个答案: