A proposal for <Route didTransitionTo>

example.js

var App = React.createClass({

  render: function () {
    return (
      <this.props.activeRouteHandler/>
    );
  }

});

var Home = React.createClass({

  render: function () {
    return <div className="home-component">home</div>;
  }

});

var User = React.createClass({

  statics: {

    didTransitionTo: function (params, query, setProps, singleRun) {
      // If you have an immediate value, use it.
      setProps({ user: UserStore.getUserByID(params.userID) });

      if (!singleRun) {
        // Setup some listeners so we can keep data up to date.
        this.userListener = function () {
          setProps({ user: UserStore.getUserByID(params.userID) });
        };

        UserStore.addChangeListener(this.userListener);
      }

      // Return a hash of values that should be used as props. Values may
      // be immediate or promises. As they resolve, props are updated.
      return {
        user: fetchUser(params.userID)
      };
    },
    
    didTransitionFrom: function (params, query) {
      UserStore.removeChangeListener(this.userListener);
    }

  },

  // The render method needs to be resilient to the fact that props
  // may not yet be loaded.
  render: function () {
    var user = this.props.user;
    var name = user == null ? 'anonymous' : user.name;

    return <div className="user-component">Hello {name}!</div>;
  }

});

var Routes = (
  <Routes location="history">
    <Route handler={App}>
      <Route name="home" handler={Home}/>
      <Route name="user" path="users/:userID" handler={User}/>
    </Route>
  </Routes>
);

React.renderComponent(Routes, document.body);