I’m trying to make some data that is generated in one of my components available to other components and I can’t seem to get it working.
I’ve tried using Session and State but neither work.
I can’t pass props (I don’t think) due to my layout. Basically it’s like this…
Sidebar | Content
I have a MainLayout component that imports lots of other components being used in the project.
I’m using react-router-dom for my routes and all of my routing is being done inside this component. It serves up the same sidebar and footer components for every route but the Content is loaded with other components depending on the route.
The Sidebar contains NavLinks that update the components in the Content area.
The Content area has components rendered inside that generate data which I need to somehow get into my Footer component.
As the Footer component is not a child component of what is rendered in Content (so therefore I can’t pass down props to it) I’ve come a bit unstuck.
I thought using Session would do it but I’m getting undefined errors. I also tried using persistent-session to do this but got a whole ton of errors (probably due to the fact I’m using the latest Meteor codebase?). I read some posts that said React ignores Session completely so that explains why it isn’t working and I know state is only valid in the component it is declared in.
So if I can’t use state or session to pull stuff out of my Content components how else can I achieve it?