CODEWITHSUNDEEP
reactjsreact-router-dom
Adriel Noach Premer
Adriel Noach Premer

Reputation: 11

react-router-dom: How do i get url parems passed, while passing other data?

I would like to have my Clubs get data straight from its parent. In the example below. other props such as data and setData are both available. but not id which should be given by the path.

<AuthRoute path="/club/:id">
 <Club data={data} setData={setData} />
</AuthRoute>

const AuthRoute = ({ children, ...props }) => {
  const { isAuthenticated } = useAuth();
  return (
    <Route {...props}>
      {isAuthenticated ? children : <Redirect to="/login" />}
    </Route>
  );
};

export const Club = (props) => {
  console.log(props);
  return <div>Hello World</div>;
};

Upvotes: 0

Views: 52

Answers (2)

Adriel Noach Premer
Adriel Noach Premer

Reputation: 11

I used useParems function in Club that worked.

const { id } = useParams();

Upvotes: 1

subhnet
subhnet

Reputation: 126

You should be able to get the id in Club component by

export const Club = (props) => {
  let club_id = props.match.params.id;
  console.log('ClubId is::',club_id);
  return <div>Hello World</div>;
};

Upvotes: 0

Related Questions