Это скорее архитектурный вопрос, касающийся реакции, чем конкретной проблемы, но что считается наилучшей практикой для управления состоянием / реквизитом с помощью компонента макета и нескольких дочерних компонентов, которые отображаются на основе URL-адреса?

Примечание: я знаю, что подобные вопросы задавались, но это немного по-другому. [Как обновить компонент ReactJS на основе URL / пути с помощью React-Router

Допустим, у меня есть что-то вроде следующего кода: страница профиля (основной вид макета) с навигационными ссылками для подразделов профиля (настройки, предпочтения, данные учетной записи и т. Д.) И главная панель, где отображается каждый из подразделов. ,

Так что в настоящее время у меня будет что-то вроде этого: мой маршрутизаторroutes.js

<Router history={browserHistory}>
  <Route path='/profile' component={Profile} >
    <IndexRoute component={Summary} />
    <Route path='/profile/settings' component={Settings} />
    <Route path='/profile/account' component={Account} />
    <Route path='/profile/preferences' component={Preferences} />
  </Route>
</Router>

и урезанная версия компонента моего профиляprofile.js

class Profile extends React.Component {

  constructor(props) {
    super(props)
  }

  render(){

    let pathName = this.props.location.pathname;

    return(
      <div className='container profile-page'>
        <div className='side-nav'>
          <ul>
            <li><Link to='/profile'>Summary</Link></li>
            <li><Link to='/profile/settings'>Settings</Link></li>
            <li><Link to='/profile/account'>My Account</Link></li>
            <li><Link to='/profile/preferences'>Preferences</Link></li>
          </ul>
        </div>
        <div className='main-content'>
         {this.props.children}
        </div>
      </div>
    )
  }
}

export default Profile;

Так что этот вид работ. Дочерние компоненты будут отображаться на основе URL. Но тогда как мне управлять состоянием и реквизитом? Как я понимаю React и Flux, я хочу, чтобы компонент Profile управлял состоянием и прослушивал изменения в моих магазинах, а также распространял эти изменения на своих дочерних элементов. Это правильно?

Моя проблема в том, что не существует интуитивно понятного способа передачи реквизита компонентам, созданным this.props.children, из-за чего я чувствую, что моя текущая архитектура и / или понимание потока неверны.

Немного руководства будет высоко ценится.