使用flatlist反应本地传递rowId

时间:2019-01-09 05:31:44

标签: listview react-native react-native-flatlist

我想传递我的rowId数据,但是会出现错误。我最初使用的是ListView,但现在已经过时了,所以我不得不使用Flatlist。但是我无法传递rowId。 这就是我要进行平面搜索的方式

export default class SongList extends Component
 {
renderSongsList() {
    let songsDataSource = this.props.section.songs;
        return(

        <FlatList
            data={songsDataSource}
            renderItem={({item,rowId}) => (
            <TouchableHighlight onPress={ () => Actions.Player({ songIndex: parseInt( rowId ), songs: this.props.section.songs  }) } activeOpacity={ 100 } underlayColor="rgba(246, 41, 118, 0.6)">
            <View>
              <Text style={styles.itemTitle}>
                { item.title }
              </Text >
              <Text style={styles.itemArtist}>
                { item.artist }
              </Text>
            </View>
          </TouchableHighlight>
        )}

            keyExtractor={(item, index) => index.toString()}
          />
    );
  } 
  render() 
  {
  return (
  <View style={ styles.list}>
  <View style={ styles.songsList }>
  { this.renderSongsList() }
  </View>
  </View>
  );}}

这是我使用ListView

的旧代码
export default class SongList extends Component
 {
renderSongsList() {               
            let songsDataSource = new ListView.DataSource({ rowHasChanged: 
(r1, r2) => r1 !== r2 }).cloneWithRows( this.props.section.songs );
            return(
              <ListView
                dataSource={ songsDataSource }
                style={ styles.songsList }
                renderRow={(song, sectionId, hello) => (
                  <TouchableHighlight onPress={ () => Actions.Player({ songIndex: parseInt( hello ), songs: this.props.section.songs  }) } activeOpacity={ 100 } underlayColor="rgba(246, 41, 118, 0.6)">
                    <View key={song} style={ styles.song }>
                      <Text style={styles.itemTitle}>
                        { song.title }
                      </Text >
                      <Text style={styles.itemArtist}>
                        { song.artist }
                      </Text>
                    </View>
                  </TouchableHighlight>
                  )}/>
    );
  } 
  render() 
  {
  return (
  <View style={ styles.list}>
  <View style={ styles.songsList }>
  { this.renderSongsList() }
  </View>
  </View>
  );}}

1 个答案:

答案 0 :(得分:0)

当与rowId一起使用时,

index将变成FlatList

renderItem={({item, index}) => (

)

请参见reference document

出于调试目的,请尝试打印它并检查它是否提供了任何东西。