我正在构建一个NavigationController在每个页面上使用相同导航栏(称为 )的 web 应用程序。所以我试图让 React Router 做这样的事情:
<BrowserRouter>
<Switch>
<Route path='/' component={NavigationContainer}>
<Route exact path='/path1' component={Comp1} />
<Route exact path='/path2' component={Comp2} />
<Route exact path='/path3' component={Comp3} />
</Route>
</Switch>
</BrowserRouter>
这样导航栏就不必在用户导航到另一个页面时重复呈现。但是,这似乎不起作用。我没有看到传入的子组件的任何道具(我想做这样的事情NavigationController:
render() {
...
return (
<div>
//Nav bar UI goes here
{this.props.children} // Ideally, Comp1/2/3 should be rendered here
</div>
);
}
推荐的实现方式是什么?我错过了什么吗?