I have a container component that is fetching data and passing the props down to its children via re-rendering its own state with the data that is returned from my API call. The issue I am facing resides in the following function:
componentDidUpdate(prevProps, prevState){
    console.log(this.props.photos);
    console.log(this.props.photos.allPhotos);
     if (this.props.photos!== prevProps.photos){
         console.log(this.props.photos);
         console.log(this.props.photos.allPhotos);
     }
 }
In this screenshot:
 I would expect the value of
I would expect the value of this.props.photos.allPhotos to be empty, as it appears to be in the console.log(this.props.photos.allPhotos) statement however....
upon expanding the object within the console, i then see values for all the fields I want to use...
I have no idea why this happens, or how to work around this. Hopefully someone else has come across this before.

