我想在每个路由中始终显示标题页。如何做到这一点。我希望 props.history 可以在该 header 组件内访问,这样如果我单击任何内容,我可以使用 props.history.push(); 导航到其他页面
<BrowserRouter>
<div>
<Header/> // I want history in this component
<Route exact path="/" component={HomePage} />
<Route path="/page1" component={Page1} />
<Route path="/page2" component={Page2} />
</div>
</BrowserRouter>
);
最佳答案
使用 Switch 一次渲染一条路线。如果您想要 header 组件中的历史记录,请使用react-router中的withRouter。 (历史记录将作为 Prop 传递给 header 组件)
https://reacttraining.com/react-router/web/api/withRouter
/* header component */
import { withRouter } from 'react-router'
export default withRouter(Header)
/* router component */
<BrowserRouter>
<div>
<Header/> // I want history in this component
<Switch>
<Route exact path="/" component={HomePage} />
<Route path="/Picklistscreen" component={PickListArea} />
<Route path="/scanarea" component={ScanArea} />
</Switch>
</div>
</BrowserRouter>
关于javascript - 如何在 react 路由器中始终显示默认组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52483439/