React component context is not passed down to subroutes

[luigy]

context is determined by where a component is created (in your mount() function), not where it is rendered (in your App component). Also note that context is experimental and likely to change in future versions. -- @spicyj

Context is not passed down to subroutes, because the handler component is created outside the rendering component.

Thoughts on having access to activeRouteHandler & activeRouteProps or some function to create the component explicitly?

[mjackson]

By design, all route handler descriptors are created inside the top-level route's render method. This lets the top-level route reference component instances easily when running willTransitionFrom hooks because it can reference them using this.refs.

What do you need the context for? I've seen it used in various places, but as you say the API is experimental so I'm not sure we need to support it.

[luigy]

Whoops, I didn't account for willTransition* hooks.

My only use for context is not having to pass down explicitly my flux instance into my sub routes vs only once at the root route.

<Route handler={FluxApp} flux={flux}>
  <Route name="dashboard" handler={Dashboard} flux={flux} />
  <Route name="form" handler={Form} flux={flux} />
</Route>

vs

<Route handler={FluxApp} flux={flux}>
  <Route name="dashboard" handler={Dashboard} />
  <Route name="form" handler={Form} />
</Route>

I'm using fluxxor and currently FluxChildMixin only checks for this.context, but I am just going make my own mixin.

getFlux: function() {
  return this.props.flux || this.context.flux;
}

Closing this and hopefully React on their next release enables passing down the context without having to create the child at the parent component being rendered.

[ryanflorence]

I've been toying with the idea of having a RouteMixin and our Route is simply the mixin implemented into a class.

This way you could make your own route:

var FluxRoute = React.createClass({
  mixins: [RouteMixin],

  getInitialProps: function() {
    return { flux: flux };
  }
});

Then you don't have to pass it to anything:

<FluxRoute handler={App}>
  <FluxRoute path="foo" handler={Foo}/>
</FluxRoute>

Seems useful?

[nelix]

RouteMixin does seem useful

[luigy]

I got to tinker with RouteMixin in a fork... I like it 👍 ... I prefer it over messing with context till it stabilizes

[derekdowling]

What ever happened with this?