ListView onEndReached nicht funktioniert, wenn innerhalb einer Ansicht

Hier ist die Sache.
Ich möchte mit der Darstellung einer listview aktualisiert die Daten, wenn onEndReached.

Während die Daten aktualisiert werden, will ich machen einen 'laden' text unterhalb der Liste (ohne das entfernen der Liste). wie diese:

render() {
  var {isFetching} = this.props.query
  var loading
  if(isFetching){
    loading = this.renderLoading()
  }
  return (
      <ListView
        dataSource={this.dataSource}
        renderRow={this.renderItem}
        onEndReached={this.props.fetchNextPage}
        onEndReachedThreshold={10}
        style={styles.listView} />
      {loading}
  )
}
renderLoading () {
  return (
    <View style={styles.loading}>
      <ActivityIndicatorIOS
        size='large'/>
      <Text>
        Loading books...
      </Text>
    </View>
  )
}

Aber bald merkte ich, dass die render-Funktion zum zurückgeben eines einzelnen Elements. Also versuchte ich Folgendes:

return (
    <View>
      <ListView
        dataSource={this.dataSource}
        renderRow={this.renderItem}
        onEndReached={this.props.fetchNextPage}
        onEndReachedThreshold={10}
        style={styles.listView}/>
      {loading}
    </View>  
  )

Aber dann die onEndReached feuerte wieder und wieder und wieder, sobald er montiert wurde. Noch bevor ich Sie berührte den Bildschirm.

Wie kann ich erreichen das laden anzuzeigen, während die 'infinite scroll' Verhalten?