[FlatList] ItemSeparatorComponent bug.

Description

When I set horizontal true for FlatList, ItemSeparatorComponent is added vertically.

Sample Code

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  FlatList
} from 'react-native';

export default class flatlist_bug extends Component {
  constructor() {
      super();

      const arr = [];
      for(let i=0; i<100; i++)
          arr.push({key: i, value: i});
      this.state = {data: arr};
  }

  render() {
      return (
          <View style={ styles.container }>
              <FlatList style={{marginTop: 100, paddingHorizontal:30, backgroundColor:'yellow', height:20}}
                  horizontal
                  ItemSeparatorComponent={ () => <View style={ { width: 10, height: 10, backgroundColor: 'red' } } /> }
                  data={ this.state.data }
                  renderItem={ (rowData) => <Text style={{backgroundColor:'blue'}} >{ rowData.item.value }</Text> }
              />
          </View>
      );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

Additional Information

• React Native version: 0.45.1
• React: 16.0.0-alpha.12
• Platform: ios. not checked android.
• Development Operating System: macOS

[I-ad]

same here, its happen after update RN to 45.0.1

[HernanAA]

That also happen to me: Android Emulator Windows “react”: “16.0.0-alpha.12”, “react-native”: “0.48.3”,