title: Conditionally set active class on menu using react router current route
body: <p>I am using react router 1.0.2 and my routes look like this:</p>
  
  <pre><code>ReactDOM.render(
    &lt;Provider store={store}&gt;
      &lt;Router history={history}&gt;
        &lt;Route path="/" component={App}&gt;
          &lt;IndexRoute component={Home}/&gt;
          &lt;Route path="triangles" component={Triangles}/&gt;
        &lt;/Route&gt;
      &lt;/Router&gt;
    &lt;/Provider&gt;,
    document.querySelector('.container')
  );
  </code></pre>
  
  <p>My App component looks like this and I thought I could pass the location in the props:</p>
  
  <pre><code>import React, {Component} from 'react';
  
  import Menu from './menu';
  
  export default class App extends Component {
    render() {
      return (
        &lt;div&gt;
          &lt;Menu/&gt;
          &lt;div className="jumbotron"&gt;
           {this.props.children &amp;&amp; React.cloneElement(this.props.children, {
              location: this.props.location
            })}
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  };
  </code></pre>
  
  <p>I want to conditionally set an active class on the Menu component:</p>
  
  <pre><code>import React, {Component} from 'react';
  
  import { pushPath } from 'redux-simple-router';
  import { Link } from 'react-router';
  
      export default class Menu extends Component {
        render() {
          return (
              &lt;nav role="navigation" className="navbar navbar-default"&gt;
                &lt;div id="navbarCollapse" className="collapse navbar-collapse"&gt;
                  &lt;ul className="nav navbar-nav"&gt;
                    &lt;li className={this.props.location.pathname === '/' ? 'active' : ''}&gt;
                      &lt;Link to="/"&gt;Home&lt;/Link&gt;
                    &lt;/li&gt;
                  &lt;/ul&gt;
                &lt;/div&gt;
              &lt;/nav&gt;
          );
        }
      };
  </code></pre>
  
  <p>But the <code>this.props.location</code> is null when the menu's render function is called?</p>
  
  <p>How can I pass props to child components?</p>