How to make a server side data request via react.js

Question

My App component in React.js currently accesses hard-coded data stored in a js variable. I want to instead fetch this piece of data by making a GET or POST request to the python flask server running for the application.

React.renderComponent( <App data={dataset}/>, document.getElementById( "App" ) );

Let's say the data can be accessed by the url /get_dataset.json on python flask. How do alter the code here?

Answer 1

Assuming you're using jQuery for ajax, you could wait to render the component until after you get the response:

$.get('/get_dataset.json', function(dataset) {
  React.renderComponent( <App data={dataset}/>, document.getElementById( "App" ) );
});

or you could do it inside the component as seen here