Merge pull request #195 from daggmano/master

Remove superfluous key prop

Author: ankeetmaini

README.md

@@ -6,10 +6,10 @@ added. An infinite-scroll that actually works and super-simple to integrate!
 # install
 ```bash
   npm install --save react-infinite-scroll-component
-  
+
   or
-  
-  yarn add react-infinite-scroll-component 
+
+  yarn add react-infinite-scroll-component
 
   // in code ES6
   import InfiniteScroll from 'react-infinite-scroll-component';
@@ -74,7 +74,7 @@ name | type | description
 **dataLength** | number | set the length of the data.This will unlock the subsequent calls to next.
 **loader** | node | you can send a loader component to show while the component waits for the next load of data. e.g. `<h3>Loading...</h3>` or any fancy loader element
 **scrollThreshold** | number &#124; string | A threshold value defining when `InfiniteScroll` will call `next`. Default value is `0.8`. It means the `next` will be called when user comes below 80% of the total height. If you pass threshold in pixels (`scrollThreshold="200px"`), `next` will be called once you scroll at least (100% - scrollThreshold) pixels down.  
-**onScroll** | function | a function that will listen to the scroll event on the scrolling container. Note that the scroll event is throttled, so you may not receive as many events as you would expect. 
+**onScroll** | function | a function that will listen to the scroll event on the scrolling container. Note that the scroll event is throttled, so you may not receive as many events as you would expect.
 **endMessage** | node |  this message is shown to the user when he has seen all the records which means he's at the bottom and `hasMore` is `false`
 **className** | string | add any custom class you want
 **style** | object | any style which you want to override
@@ -87,4 +87,3 @@ name | type | description
 **pullDownToRefreshThreshold** | number | minimum distance the user needs to pull down to trigger the refresh, `default=100px` , a lower value may be needed to trigger the refresh depending your users browser.
 **refreshFunction** | function | this function will be called, it should return the fresh data that you want to show the user
 **initialScrollY** | number | set a scroll y position for the component to render with.
-**key** | string | the key for the current data set being shown, used when the same component can show different data sets at different times, `default=undefined`

src/index.tsx

@@ -22,7 +22,6 @@ export interface Props {
   onScroll?: (e: MouseEvent) => any;
   dataLength: number;
   initialScrollY?: number;
-  key?: string;
   className?: string;
 }
 
@@ -138,11 +137,8 @@ export default class InfiniteScroll extends Component<Props, State> {
   }
 
   UNSAFE_componentWillReceiveProps(props: Props) {
-    // do nothing when dataLength and key are unchanged
-    if (
-      this.props.key === props.key &&
-      this.props.dataLength === props.dataLength
-    )
+    // do nothing when dataLength is unchanged
+    if (this.props.dataLength === props.dataLength)
       return;
 
     this.actionTriggered = false;