fix crash with onEndReached={null}

Reviewed By: bvaughn Differential Revision: D4815310 fbshipit-source-id: 69d4a5a6fd247bdf877465a7cd07924a0dd6584b
mhorowitz · Apr 4, 2017 · b12f6db · b12f6db
1 parent e0bd35f
commit b12f6db
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 12 deletions.
diff --git a/Examples/UIExplorer/js/FlatListExample.js b/Examples/UIExplorer/js/FlatListExample.js
@@ -62,7 +62,7 @@ class FlatListExample extends React.PureComponent {
   static description = 'Performant, scrollable list of data.';
 
   state = {
-    data: genItemData(1000),
+    data: genItemData(100),
     debug: false,
     horizontal: false,
     filterText: '',
@@ -142,6 +142,7 @@ class FlatListExample extends React.PureComponent {
           }
           legacyImplementation={false}
           numColumns={1}
+          onEndReached={this._onEndReached}
           onRefresh={this._onRefresh}
           onScroll={this.state.horizontal ? this._scrollSinkX : this._scrollSinkY}
           onViewableItemsChanged={this._onViewableItemsChanged}
@@ -157,6 +158,11 @@ class FlatListExample extends React.PureComponent {
   _getItemLayout = (data: any, index: number) => {
     return getItemLayout(data, index, this.state.horizontal);
   };
+  _onEndReached = () => {
+    this.setState((state) => ({
+      data: state.data.concat(genItemData(100, state.data.length)),
+    }));
+  };
   _onRefresh = () => alert('onRefresh: nothing to refresh :P');
   _renderItemComponent = ({item}) => {
     return (

diff --git a/Examples/UIExplorer/js/ListExampleShared.js b/Examples/UIExplorer/js/ListExampleShared.js
@@ -39,9 +39,9 @@ const {
 
 type Item = {title: string, text: string, key: number, pressed: boolean, noImage?: ?boolean};
 
-function genItemData(count: number): Array<Item> {
+function genItemData(count: number, start: number = 0): Array<Item> {
   const dataBlob = [];
-  for (let ii = 0; ii < count; ii++) {
+  for (let ii = start; ii < count + start; ii++) {
     const itemHash = Math.abs(hashCode('Item ' + ii));
     dataBlob.push({
       title: 'Item ' + ii,

diff --git a/Libraries/Lists/VirtualizedList.js b/Libraries/Lists/VirtualizedList.js
@@ -259,7 +259,6 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
       return String(index);
     },
     maxToRenderPerBatch: 10,
-    onEndReached: () => {},
     onEndReachedThreshold: 2, // multiples of length
     removeClippedSubviews: true,
     renderScrollComponent: (props: Props) => {
@@ -636,7 +635,8 @@ class VirtualizedList extends React.PureComponent<OptionalProps, Props, State> {
     }
     const distanceFromEnd = contentLength - visibleLength - offset;
     const itemCount = getItemCount(data);
-    if (this.state.last === itemCount - 1 &&
+    if (onEndReached &&
+        this.state.last === itemCount - 1 &&
         distanceFromEnd < onEndReachedThreshold * visibleLength &&
         (this._hasDataChangedSinceEndReached ||
          this._scrollMetrics.contentLength !== this._sentEndForContentLength)) {

diff --git a/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap b/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap
@@ -34,7 +34,6 @@ exports[`FlatList renders all the bells and whistles 1`] = `
   maxToRenderPerBatch={10}
   numColumns={2}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onRefresh={[Function]}
@@ -134,7 +133,6 @@ exports[`FlatList renders empty list 1`] = `
   maxToRenderPerBatch={10}
   numColumns={1}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onScroll={[Function]}
@@ -164,7 +162,6 @@ exports[`FlatList renders null list 1`] = `
   maxToRenderPerBatch={10}
   numColumns={1}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onScroll={[Function]}
@@ -206,7 +203,6 @@ exports[`FlatList renders simple list 1`] = `
   maxToRenderPerBatch={10}
   numColumns={1}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onScroll={[Function]}

diff --git a/Libraries/Lists/__tests__/__snapshots__/SectionList-test.js.snap b/Libraries/Lists/__tests__/__snapshots__/SectionList-test.js.snap
@@ -26,7 +26,6 @@ exports[`SectionList rendering empty section headers is fine 1`] = `
   keyExtractor={[Function]}
   maxToRenderPerBatch={10}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onScroll={[Function]}
@@ -130,7 +129,6 @@ exports[`SectionList renders all the bells and whistles 1`] = `
   keyExtractor={[Function]}
   maxToRenderPerBatch={10}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onRefresh={[Function]}
@@ -269,7 +267,6 @@ exports[`SectionList renders empty list 1`] = `
   keyExtractor={[Function]}
   maxToRenderPerBatch={10}
   onContentSizeChange={[Function]}
-  onEndReached={[Function]}
   onEndReachedThreshold={2}
   onLayout={[Function]}
   onScroll={[Function]}