r/reactjs•
patronics

How to quickly shoehorn a global variable into a bloated React-Bootstrap theme

I recently finished a quick application using a React-Bootstrap theme that my boss purchased. I now find myself needing to add what is basically a global variable--a state that a bunch of different un-nested components need to be able to see and update. That value also needs to get updated in local storage.

I've looked at using Redux, but I'm locked into the versions of react and react-router that this theme uses, so I had trouble getting it working in there. I also don't have a ton of time to learn Redux right now.

My other thought was to try to set this value at the <Router> level and pass it down to all my other components, but then I'd have to mess with the purchased theme components, something I'm trying to avoid.

Any advice?

Posted Nov 17, 2015, 8:45 PM UTC

32
vinspee•

Can you pass it into the react root when you render it? I.E. React.render(<YourApp uglyPurchasedComponentData={window.uglystuff} />, el);

1
patronicsOP•

The root of my app is <Router>, and I haven't been successful trying to pass a prop down through it so far.

1