React router only works when pressing the back button

Question

I have an extremely simple react router setup which is not working correctly. When I navigate the URL bar changes but react router never updates the page. If I reload the page the correct route gets rendered on initial load. If I press the back/forward button react router correctly navigates between the routes. Even when back/forward is working with react router clicking on a link to the page I can reach with back/forward still does nothing.

My routes

import { Router, Route, IndexRoute, browserHistory } from 'react-router'
import AppContainer from './components/react/app_container.jsx'
import Signup from './components/react/login_and_signup/signup.jsx'
import SplashPage from './components/react/splash_page/splash_page.jsx'
export const routes = (
    <Router history={browserHistory}>
        <Route path="/" component={AppContainer}>
            <IndexRoute component={SplashPage} />
            <Route path="signup" component={Signup} />
        </Route>
    </Router>
);

To bootstrap my app

import ReactDOM from 'react-dom';
import {routes} from '../imports/client/routes'

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

My AppContainer

import React from 'react';

let AppContainer = React.createClass({
    componentWillReceiveProps(nextProps){
      console.log("next props? ", nextProps);
    },
    render(){
        return <div>{this.props.children}</div>
    }
});

export default AppContainer;

In my splash page:

<Link to="/signup">
   signup
</Link>

Here is the behavior I get:

Reload page at / URL, splash page loads
Click signup link, URL changes to /signup but signup component is not rendered and console.log in componentWillReceiveProps is not output
Reload the page while on /signup and the signup component correctly renders
Press the back button and the splash page component correctly renders and the props are output from componentWillReceiveProps
Forward and back button works fine at this point
Click signup link on splash page, URL changes to /signup but nothing happens

As far as I can tell I have everything configured correctly but react router is silently failing except on back/forward buttons.

I am on React 15.0.1 and React Router 2.4.1.

imagio imagio · Accepted Answer · 2016-06-04T20:31:30

The meteor package Iron Router was included in my project and was conflicting with React Router. Removing Iron Router solved the problem.

React router only works when pressing the back button

1 Answers