Check if react-router path is active

According to the docs, you could use matchPath function which takes two arguments:

  1. pathname you want to match (String).
  2. options (Object) or path (String) to match against.

If matched it will return an object of this shape:

{
  path, // the path used to match
  url, // the matched portion of the URL
  isExact, // whether or not we matched exactly
  params
}

Otherwise you’ll get null.

To make use of it in your components you could simply do:

import { matchPath } from 'react-router';

// ...

render () {
  const isMovieWatchPathActive = !!matchPath(
    this.props.location.pathname, 
    '/Movies/:id/watch'
  ); 

  // ...
}

Hope it’ll help someone.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)