Barebones React Native list view

my_list.js

"use strict";

import React, {
  StyleSheet,
  Text,
  View,
  TouchableHighlight,
  ListView
} from "react-native";

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  seperator: {
    height: StyleSheet.hairlineWidth,
    backgroundColor: '#CCCCCC',
  },
  row: {
    flex: 1
  }
});

class MyList extends React.Component {
  constructor(props) {
    super(props);

    let ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });

    this.props = props || {};
    this.state = { dataSource: ds.cloneWithRows(this.props.items || []) };
  }

  onRowPress(rowData) {
    console.log("rowPressed:", rowData);
  }

  componentWillReceiveProps(newProps) {
    if (newProps.items) {
      this.setState({ dataSource: this.state.dataSource.cloneWithRows(newProps.items) });
    }
  }

  renderSeparator(sectionID, rowID) {
    return (
      <View key={sectionID + "-" + rowID + "-sep"} style={styles.seperator} />
    )
  }

  renderRow(rowData, sectionID, rowID) {
    return (
      <TouchableHighlight key={sectionID + "-" + rowID + "-row"} onPress={() => this.onRowPress(rowData)}>
        <View style={styles.row}>
          <Text>{rowData}</Text>
        </View>
      </TouchableHighlight>
    )
  }

  render() {
    return (
      <ListView
        dataSource={this.state.dataSource}
        renderSeparator={this.renderSeparator.bind(this)}
        renderRow={this.renderRow.bind(this)}
        initialListSize={this.state.dataSource.getRowCount()}
        scrollRenderAheadDistance={500}
      />
    );
  }
}

export default MyList;