title: ListView's onEndReached not working when inside a View
body: <p>Here is the thing. 
  I want to render a listview that updates the data when onEndReached. </p>
  
  <p>While the data is updated, I want to render a 'loading' text below the list (without removing the list).   like this:</p>
  
  <pre><code>render() {
    var {isFetching} = this.props.query
    var loading
    if(isFetching){
      loading = this.renderLoading()
    }
    return (
        &lt;ListView
          dataSource={this.dataSource}
          renderRow={this.renderItem}
          onEndReached={this.props.fetchNextPage}
          onEndReachedThreshold={10}
          style={styles.listView} /&gt;
        {loading}
    )
  }
  renderLoading () {
    return (
      &lt;View style={styles.loading}&gt;
        &lt;ActivityIndicatorIOS
          size='large'/&gt;
        &lt;Text&gt;
          Loading books...
        &lt;/Text&gt;
      &lt;/View&gt;
    )
  }
  </code></pre>
  
  <p>But soon I realised that the render function has to return a single element. So I tried this:</p>
  
  <pre><code>return (
      &lt;View&gt;
        &lt;ListView
          dataSource={this.dataSource}
          renderRow={this.renderItem}
          onEndReached={this.props.fetchNextPage}
          onEndReachedThreshold={10}
          style={styles.listView}/&gt;
        {loading}
      &lt;/View&gt;  
    )
  </code></pre>
  
  <p>But then the onEndReached fired again and again and again as soon as it was mounted. Even before I touched the screen. </p>
  
  <p>How can I achieve the loading view, while keeping the 'infinite scroll' behavior?</p>