Can't do isActive check

Question

I have route

<Route path="/catalog/:category" component={CatalogList} />

When I'm on page /catalog/10, for example, I try to check is that route active

this.context.router.isActive('/catalog/:category')

But I got false always. How to check this?

example:

const Test = React.createClass({
    contextTypes: {
        router: React.PropTypes.object.isRequired
    },

    render() {
        console.log(this.props.location.pathname);  // /catalog/12
        console.log(this.context.router.isActive('/catalog/:category'));    // false (need true)
        console.log(this.context.router.isActive('/catalog/12'));   //true
        return <Link to="/catalog/12">Lets test</Link>;
    }
});

render((
    <div>
        <Router history={browserHistory}>
            <Route path="/catalog/:category" component={Test} />
            <Route path="/" component={Test} />
        </Router>
    </div>
), document.getElementById('app'));

Answer 1

As stated in the docs

A route is only considered active if all the URL parameters match, including optional parameters and their presence or absence.

which means URL parameters have to match. That is why in your example :

this.context.router.isActive('/catalog/:category'); // false
this.context.router.isActive('/catalog/12');        // true

You could use a regular expression on location.pathname

this.props.location.pathname.match(/^\/catalog\/\d+\/?$/);