'Sending parameter to Link to a Router component Reacts

Im currently trying to send a state from the Link component to the Router component.

The router component looks like this:

<Route
  exact
  path='/banner/edit/:id'
>
  {!user && <Redirect to="/login" />}
  {user && org && <EditBanner uid={user.uid} org={org} />}
</Route>

This component is only rendered when the user is not null, and when the org is not null.

The EditBanner has a state called: bannerTitle:

export const EditBanner = ({ uid, org }) => {

  // States
  const [bannerTitle, setBannerTitle] = useState(null);
  ...

And when I am using Link to go to the component, I want to pass in the bannerTitle as a property to set the state in the EditBanner component. However, this is not having any effect on the Component.

<Link
  to={{
    pathname: "/banner/edit/" + banner.id,
    state: { bannerTitle: "HELLO" }
  }}
>
  Edit
</Link>

Where can I get the passed props?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source