how to pass the data from one page to another in react.js and using reach router

Question

There is some data that I want to use on the second page am routing to that page using the reach router Link is there a way we can do so?

Answer 1

We can do this way when using reach-router

An object to put on location state.

Page 1(Navigated from):

const NewsFeed = () => (
  <div>
    <Link
      to="photos/123"
      state={{ fromFeed: true }}
    />
  </div>
)

page 2(Navigated to):

const Photo = ({ location, photoId }) => {
  if (location.state.fromFeed) {
    return <FromFeedPhoto id={photoId} />
  } else {
    return <Photo id={photoId} />
  }
}

for more details use this documentation https://reach.tech/router/api/Link[][1]