Question

我有一个应用程序在渲染任何组件之前运行服务，并且该服务进行多次API调用，我获取数据，例如汽车，卡车和自行车列表。现在我想将这些道具传递给孩子，具体取决于用户点击的路线。如果他访问/汽车然后我会发送给汽车的this.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

您需要使用react-router来实现此目的。创建两个单独的组件Bikes，Cars和route然后使用react-router定义链接到这些页面，如下所示。

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

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

通过反应路由器将道具传递给儿童

1 个答案: