reactjs - React router and this.props.children - how to pass state to this.props.children -

i'm using react-router first time , don't know how think in yet. here's how i'm loading components in nested routes.

entry point .js

reactdom.render(     <router history={hashhistory} >         <route path="/" component={app}>             <route path="models" component={content}>         </route>     </router>,      document.getelementbyid('app') ); 

app.js

  render: function() {     return (       <div>         <header />         {this.props.children}       </div>     );   } 

so child of app content component sent in. i'm using flux , app.js has state , listens changes, don't know how pass state down this.props.children. before using react-router app.js defines children explicitly, passing state natural don't see how now.

using couple of react helper methods can add state, props , whatever else this.props.children

render: function() {   var children = react.children.map(this.props.children, function (child) {     return react.cloneelement(child, {       foo: this.state.foo     })   })    return <div>{children}</div> } 

then child component can access via props, this.props.foo.