title: How to implement onEndReached() and onRefresh() "horizontally" in react native FlatList in react native
body: <p>In my app I have a horizontal <code>flatlist</code> which rendering list of simple boxes horizontally like slide.</p>
  
  <p>Here is my flatlist : </p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;FlatList
      data={[{key: 'a'}, {key: 'b'}, {key: 'c'}, {key: 'd'}, {key: 'e'}]}
      ref={(slider) =&gt; { this.slider = slider }}
      onEndReachedThreshold={1}
      onEndReached={() =&gt; {
          alert("onEndReached");
      }}
      refreshing={true}
      onRefresh={() =&gt; {
          alert("refreshing");
      }}
      renderItem={({item, index}) =&gt; (
          &lt;View style={{
              paddingHorizontal: 5, 
              paddingVertical: 10,
          }}&gt;
              &lt;SlideItem&gt;&lt;MText&gt; Text {index} &lt;/MText&gt;&lt;/SlideItem&gt;
          &lt;/View&gt;
      )}
      horizontal={true}
  /&gt;
  </code></pre>
  
  <p>Now, I want to call some method when list reached the end. So I implemented <code>onEndReached()</code>. But it called at start when I scroll not when I reached at the end of list.</p>
  
  <p>Basically my main aim is to load more data on right side when user reached at end of flatlist and load more data on left side when user reach on the first item of flatlist.</p>
  
  <p>Please any one can help me !!!</p>