Javascript 使用react路由器和镭的路由问题
我正在制作一个关于reactJS的网站。我使用镭和反应路由器进行路由。 我的路线有很多问题 在我的主页上有一个固定导航栏菜单,带有指向文档页面的链接 在此文档页面上,我也有此栏,但要访问其他链接,我必须单击2次才能到达Javascript 使用react路由器和镭的路由问题,javascript,reactjs,react-router,radium,Javascript,Reactjs,React Router,Radium,我正在制作一个关于reactJS的网站。我使用镭和反应路由器进行路由。 我的路线有很多问题 在我的主页上有一个固定导航栏菜单,带有指向文档页面的链接 在此文档页面上,我也有此栏,但要访问其他链接,我必须单击2次才能到达 class App extends Component { render() { return ( <Router history={hashHistory}> <Switch>
class App extends Component {
render() {
return (
<Router history={hashHistory}>
<Switch>
<Route exact path="/" component={LandingPage}/>
<Route path="/documentation" component={DocumentationRoutes}/>
<Route path="/blog" component={OnContrustion}/>
<Route path="/contactus" component={OnContrustion}/>
</Switch>
</Router>
);
}
}
export default App;
类应用程序扩展组件{
render(){
返回(
);
}
}
导出默认应用程序;
以下是文档路线:
class DocumentationRoutes extends Component {
render() {
return (
<Router history={hashHistory}>
<Switch>
<Route path="/documentation" component={Documentation}/>
<IndexRoute component={Documentation} />
</Switch>
</Router>
);
}
}
export default DocumentationRoutes;
class DocumentationRoutes扩展组件{
render(){
返回(
);
}
}
导出默认文档路径;
以及文件:
class Documentation extends Component {
render() {
return (
<VerticalLayout>
<StretchLayout>
<NavBar />
</StretchLayout>
<StretchLayout margin="20">
<CenterLayout>
<SubTitle>Documentation</SubTitle>
</CenterLayout>
<DocMenu />
</StretchLayout>
</VerticalLayout>
);
}
}
export default Documentation;
类文档扩展了组件{
render(){
返回(
文档
);
}
}
导出默认文档;
这是使用react路由器的正确方法吗?
单击一次后,如何重定向?
第一次单击时,url会正确更改,但页面不会更改
谢谢,您只需要在初始路由定义中使用
路由器
组件。您的DocumentationRoutes
组件应该是:
同样在react路由器
v4IndexRoute
中不再存在
class DocumentationRoutes extends Component {
render() {
return (
<Switch>
<Route path="/documentation" component={Documentation}/>
<Route component={Documentation} />
</Switch>
);
}
}
export default DocumentationRoutes;
class DocumentationRoutes扩展组件{
render(){
返回(
);
}
}
导出默认文档路径;
您有嵌套路由器吗?这似乎不对。您应该有一个带有嵌套路由的路由器,每个路由都应该有一个组件,它是某种视图,同样,不是路由器。