Reagieren Router - erhalten Weg prop außerhalb der gebundenen Komponente

Question

ich einige Routen definiert:

render((
    <Router history={hashHistory}> 
     <Route path="/" component={App}> 
      <IndexRoute component={IndexContainer} /> 
      <Route path="/agence" headerWhite={true} component={AgencyContainer} /> 
     </Route> 
    </Router> 
), document.getElementById('app')); 

Wie Sie sehen können, habe ich eine Stütze headerWhite={true} auf /agence Route. Ich kann es in meiner AgencyContainer Komponente über this.props.route.headerWhite zugreifen. Aber was ich will ist in der Lage zu sein, in meiner App Komponente darauf zuzugreifen. Gibt es einen einfachen Weg, es zu tun?

Was ich erreichen möchte ist, dass prop zu meiner Header Komponente, die in meiner App Komponente gerendert wird, da es auf jeder Seite der Website sein muss.

Vielen Dank.

Answer 1

löste ich das Problem, indem Sie folgendermaßen vorgehen:

import React from 'react'; 
import Page from './Page'; 
import Header from './Header'; 

function getCurrentRoute(router, routes) { 
    const currentRoute = routes.filter(route => route.path && router.isActive(route.path, true)); 

    return currentRoute[0]; 
} 

function App(props, context) { 
    const currentRoute = getCurrentRoute(context.router, props.routes); 

    return (
     <Page> 
      <Header headerWhite={currentRoute.headerWhite} /> 
      {props.children} 
     </Page> 
    ) 
} 

App.contextTypes = { 
    router: React.PropTypes.object.isRequired 
}; 

export default App; 

Dennoch ist es mein Problem löst, aber ich weiß nicht, es gibt eine besser Art und Weise zu tun ist. Also, wenn jemand eine bessere Lösung hat, bitte geben Sie es und ich werde Ihre Antwort akzeptieren!