Пропустить реквизиты для детей с помощью реагирующего маршрутизатора

Question

У меня есть приложение, которое запускает службу перед рендерингом любого компонента, и эта служба выполняет несколько вызовов API, я получаю данные, например, список автомобилей, грузовиков и велосипедов. Теперь я хочу передать эти реквизиты для детей, в зависимости от того, какой клик пользователя маршрута. Если он посещает/машины, то я бы послал на эти данные.props.children для автомобилей, и если он посетит/велосипеды, я бы отправил данные о велосипеде. Как я могу достичь этого в MainComponent?

<ul> 
    <li><Link to="/">Home</Link></li> 
    <li><Link to="/bikes">Bikes</Link></li> 
    <li><Link to="/cars">Cars</Link></li> 
</ul> 
{this.props.children} 

Answer 1

Для достижения этого необходимо использовать реактивный маршрутизатор. Создайте два отдельных компонента: «Велосипеды», «Автомобили» и «Маршрут», затем привязайтесь к этим страницам, используя определение реактивного маршрутизатора, как показано ниже.

ReactDOM.render(
    <Router history={hashHistory}> 
     <Route path="/" component={MainComponent}> 
      <Route path="bikes" component={Bikes}> 
      <Route path="cars" component={Cars}> 

     </Route> 
    </Router>, document.getElementById('app') 
);