diff --git a/lib/index.js b/lib/index.js
index 322c97f..fc8112a 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -39,7 +39,10 @@ var ImageLoader = function (_React$Component) {
 
     var _this = _possibleConstructorReturn(this, (ImageLoader.__proto__ || Object.getPrototypeOf(ImageLoader)).call(this, props));
 
-    _this.state = { status: props.src ? Status.LOADING : Status.PENDING };
+    _this.state = {
+      status: props.src ? Status.LOADING : Status.PENDING,
+      src: props.src
+    };
     if (_react2.default.Children.count(props.children) !== 3) console.error('wrong # of children provided to ImageLoader');
     return _this;
   }
@@ -51,15 +54,6 @@ var ImageLoader = function (_React$Component) {
         this.createLoader();
       }
     }
-  }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps) {
-      if (this.props.src !== nextProps.src) {
-        this.setState({
-          status: nextProps.src ? Status.LOADING : Status.PENDING
-        });
-      }
-    }
   }, {
     key: 'componentDidUpdate',
     value: function componentDidUpdate() {
@@ -140,6 +134,17 @@ var ImageLoader = function (_React$Component) {
         (this.state.status === Status.LOADING || this.state.status === Status.PENDING) && childrenArray[2]
       );
     }
+  }], [{
+    key: 'getDerivedStateFromProps',
+    value: function getDerivedStateFromProps(nextProps, prevState) {
+      if (prevState.src !== nextProps.src) {
+        return {
+          status: nextProps.src ? Status.LOADING : Status.PENDING,
+          src: nextProps.src
+        };
+      }
+      return null;
+    }
   }]);
 
   return ImageLoader;
diff --git a/src/index.js b/src/index.js
index ce23854..7306899 100644
--- a/src/index.js
+++ b/src/index.js
@@ -20,7 +20,10 @@ export default class ImageLoader extends React.Component {
 
   constructor(props) {
     super(props);
-    this.state = {status: props.src ? Status.LOADING : Status.PENDING};
+    this.state = {
+      status: props.src ? Status.LOADING : Status.PENDING,
+      src: props.src
+    };
     if(React.Children.count(props.children) !== 3)
       console.error('wrong # of children provided to ImageLoader')
   }
@@ -31,12 +34,14 @@ export default class ImageLoader extends React.Component {
     }
   }
 
-  componentWillReceiveProps(nextProps) {
-    if (this.props.src !== nextProps.src) {
-      this.setState({
+  static getDerivedStateFromProps(nextProps, prevState) {
+    if (prevState.src !== nextProps.src) {
+      return {
         status: nextProps.src ? Status.LOADING : Status.PENDING,
-      });
+        src: nextProps.src
+      };
     }
+    return null;
   }
 
   componentDidUpdate() {