Fix shallow comparison of itemsChanged

xiaolin · Aug 22, 2019 · 3ea5a43 · 3ea5a43
1 parent 65d98b8
commit 3ea5a43
Showing 1 changed file with 9 additions and 9 deletions.
diff --git a/src/ImageGallery.jsx b/src/ImageGallery.jsx
@@ -163,9 +163,17 @@ export default class ImageGallery extends React.Component {
     },
   };
 
+  componentDidMount() {
+    if (this.props.autoPlay) {
+      this.play();
+    }
+    window.addEventListener('keydown', this._handleKeyDown);
+    this._onScreenChangeEvent();
+  }
+
   componentDidUpdate(prevProps, prevState) {
     const itemsSizeChanged = prevProps.items.length !== this.props.items.length;
-    const itemsChanged = prevProps.items !== this.props.items;
+    const itemsChanged = JSON.stringify(prevProps.items) !== JSON.stringify(this.props.items);
     const startIndexUpdated = prevProps.startIndex !== this.props.startIndex;
     if (itemsSizeChanged) {
       this._handleResize();
@@ -188,14 +196,6 @@ export default class ImageGallery extends React.Component {
     }
   }
 
-  componentDidMount() {
-    if (this.props.autoPlay) {
-      this.play();
-    }
-    window.addEventListener('keydown', this._handleKeyDown);
-    this._onScreenChangeEvent();
-  }
-
   componentWillUnmount() {
     window.removeEventListener('keydown', this._handleKeyDown);