Question

我在reactJS的网站上工作。我使用radium并为路由做出反应路由器。路线有很多问题......

在我的主页上有一个固定的导航栏菜单，其中包含指向文档页面的链接。

在这个文档页面上，我也有这个栏，但要访问其他链接，我必须点击2次才能到达那里..

 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;

这是DocumentationRoutes：

class DocumentationRoutes extends Component {

  render() {
    return (
      <Router history={hashHistory}>
        <Switch>
          <Route path="/documentation" component={Documentation}/>
          <IndexRoute component={Documentation} />

        </Switch>
      </Router>
    );
  }
}

export default DocumentationRoutes;

和文档：

class Documentation extends Component {

  render() {
    return (
    <VerticalLayout>
      <StretchLayout>
        <NavBar />
        </StretchLayout>
        <StretchLayout margin="20">
          <CenterLayout>
            <SubTitle>Documentation</SubTitle>
          </CenterLayout>
          <DocMenu />
        </StretchLayout>
      </VerticalLayout>
    );
  }
}

export default Documentation;

使用反应路由器是否正确？只需单击一次，我该怎么做才能重定向？在第一次单击时，网址会正确更改，但页面不会更改。

谢谢，

Answer 1

您只需要在初始路由定义中使用Router组件。您的DocumentationRoutes组件应为：

同样在react-router v4 IndexRoute不再存在。

class DocumentationRoutes extends Component {

  render() {
    return (
        <Switch>
          <Route path="/documentation" component={Documentation}/>
          <Route component={Documentation} />    
        </Switch>
    );
  }
}

export default DocumentationRoutes;

具有反应路由器和镭的路由问题

1 个答案: