FlatList onEndReached can not be called!

React Native version: 0.59.9

Steps To Reproduce

I console log in VirtualizedLIst. The function _maybeCallOnEndReached() called.

_maybeCallOnEndReached() {
 const {
   data,
   getItemCount,
   onEndReached,
   onEndReachedThreshold,
 } = this.props;
 const {contentLength, visibleLength, offset} = this._scrollMetrics;
 const distanceFromEnd = contentLength - visibleLength - offset;
 if (
   onEndReached &&
   this.state.last === getItemCount(data) - 1 &&
   /* $FlowFixMe(>=0.63.0 site=react_native_fb) This comment suppresses an
    * error found when Flow v0.63 was deployed. To see the error delete this
    * comment and run Flow. */
   distanceFromEnd < onEndReachedThreshold * visibleLength &&
   (this._hasDataChangedSinceEndReached ||
     this._scrollMetrics.contentLength !== this._sentEndForContentLength)
 ) {
   // Only call onEndReached once for a given dataset + content length.
   this._hasDataChangedSinceEndReached = false;
   this._sentEndForContentLength = this._scrollMetrics.contentLength;
   onEndReached({distanceFromEnd});
 }
}

console result: this.state.last = 0; getItemCount(data) = 2; this.state.last !== getItemCount(data) -1 , so can not trigger onEndReached!

But for FlatList, it has reach end!

[ssancheza227]

@JerakRus @luoyushouchai @e1016 Hi guys 😃 good news, well the solution was envolved flatList into View and set height (const {height} = Dimensions.get(‘window’);) to view, percent not work:

<View style={{flex: 1, height: height}}>
   <FlatList
       data={data}
       keyExtractor={(item, index) => index.toString()}
       onEndReached={this.handleLoadMore} 
       onEndReachedThreshold={0.01}
       ListFooterComponent={() => this.state.loading ? <ActivityIndicator/> : null}
       renderItem={({item, index}) => this.renderTransaction(item, index)}
   />
</View>

And if this not scroll envolved into ScrollView: ScrollView -> View (height) -> FlatList

[ggdegreat]

0.61.3 still happening …