Reactive Router Global Data

Question

How to save a central / global object for some data using a reaction router?

Say my React site has 20 different routes. 15 of these 20 routes need a single JSON file from a server that almost never changes. I can't wait to get / api / mydata for every new URL / route.

I think I can save the data in a React context , but it seems hacked and may not even work. Is there a more elegant solution for exchanging data between components of a react router?

Edit: I partially solved this by creating a Data.js file:

export var myData = function(cb) {
  ajax('GET', '/api/mydata', resp => {
    myData = function() {
      return cb(resp);
    };
    cb(resp);
  });
};

and use it as follows:

myData(data => data.map(/* ...use the data */));

Thus, data is guaranteed to be retrieved only once per life cycle.

Answer 1

Arrr... , , , js

let appState = {};
export default appState;

ajax, . , .