Accepted answer

this.setState is an asynchronous function
and console.log("The prodcuts are", this.state.products) is a synchronous code
so it doesn't print the correct result
You can print the data in the callback function of this.setState
like this

this.setState({...}, () => {

You should be able to get the correct result
And in the ProductListing component
I'm not sure when you're printing the console.log
because your data is being requested asynchronously and you're getting
and the rendering of the child component is not necessarily done after the request
So if you want to successfully print the data from the child component
either during the update lifecycle
or in the render function
Hope this helps you out

Related Query

More Query from same tag