Реагировать на собственный проход rowId с помощью flatlist - PullRequest
0 голосов
/ 09 января 2019

Я хочу передать свои данные rowId, но получу ошибку. Изначально я использовал ListView, но теперь он устарел, поэтому вместо него я должен использовать Flatlist. Но я не мог передать свой rowId. Вот как я делаю это для flatlist

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 голосов
/ 09 января 2019

rowId станет index, когда вы используете его с FlatList

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

)

См. справочный документ

Также для отладки попробуйте распечатать его и проверить, дает ли он что-нибудь или нет.

...