Communicating data between react routes or components which have no relation

user_4324116 0
Viewed 263

How do I communicate data between two components which has no parent-child relation ,neither sibling components which has a common parent .

Scenario : I have two component Home and About

Both are mapped to two route path in App.tsx which would be my starting component. How can store something from home component and fetch the same data in About component

Note : 1. Looking for any in-built mechanism of react to achieve this , cannot use Redux due to project constraints.

  1. Dont want to use route params as they are not immediate routes and I can have multiple routes.
react-router reactjs
2 Answers

Just to make you think again about it a little bit more: any two components in your app have a common parent.

Now to be more practical, if you think the relationship between those two component is really at a global level, you can use the built-in React.Context.

user_11477720

You can use the localStorage of navigator to store the data, and then load in the about page.

localStorage.setItem(keyName, JSON.stringify(object));

and when you need read the data

var data = JSON.parse(localStorage.getItem(keyName));
user_105828190
Related