Wait for react-promise to resolve before render

Question

So I have a large set of data that I\'m retrieving from an API. I believe the problem is that my component is calling the renderMarkers function before the data is received from

Answer 1

Calling the render function before the API call is finished is fine. The wells is an empty array (initial state), you simply render nothing. And after receiving the data from API, your component will automatically re-render because the update of props (redux store). So I don't see the problem.

If you really want to prevent it from rendering before receiving API data, just check that in your render function, for example:

if (this.props.wells.length === 0) {
  return null
}

return (
  

    {this.renderMarkers()}
  
)