react - router withRouter does not inject router

Question

I want to use withRouter on my top-level React component called \'App\'.

Documentation is here: https://github.com/reactjs/react-router/blob/v2.4.0/upgrade-guides/v2

Answer 1

That is happening because you are injecting the router after you render the react app.

const App = React.createClass({
  render() {
      return (
          

              this.props.router.push('/')}
              >
              
              


            {this.props.children}
          
      );
  }
});

App = withRouter(App);


render((
  
    
      
          
          
      
    
  
  ), document.getElementById('app'));

A better solution would be creating a file for App like you have done with the other components.

const App = React.createClass({
  render() {
      return (
          

              this.props.router.push('/')}
              >
              
              


            {this.props.children}
          
      );
  }
});

module.exports = withRouter(App);

and import it in your index.js.