Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

303
Views
How to use matchPatch with dynamic links on React Router v6

The path I'm trying to match is /threats/live/:id

We have a component where we usually render our breadcrumbs in and this was how they were built using react router v5:

const breadcrumbOptions = routes
  .filter((route) => matchPath(pathname, { path: route.link, exact: false }))
  .map((route) => ({
    ...route,
    label: route.breadCrumbtitle,
    onclick: undefined,
}))

For v6 this doesn't seem to work because it looks for :id in the url but instead finds the actual id.

I've tried the following but it still didn't work for me

const breadcrumbOptions = routes
  .filter((route) =>
    matchPath(
      { path: pathname, caseSensitive: false, end: false },
      route.link
    )
  )
  .map((route) => ({
    ...route,
    label: route.breadcrumbTitle,
    onclick: undefined,
}))
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I think that in v6 the function parameters of matchPath were reversed.

Could you try to do

matchPath(route.link, pathname)

instead?

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!