时间戳

首页 > 解决方案 > 无法从子路由到父路由 - ReactJS

javascript - 无法从子路由到父路由 - ReactJS

问题描述

我在这里有一个路线列表，这是一个顶部导航。当我单击每个项目时，它会转到该路线。一旦我在子路线中并单击顶部导航之一，它会从我拥有的路线中添加路径，而无需清除路线。

例子

/api > 从这条路线我可以去任何地方

/api/id > 但是如果我点击/api链接到顶部导航，它会从这里变为/api/id/api

应用程序.jsx

  <BrowserRouter>
  <div className="App">
    <Navigation />
    <Switch>

    <Route path="/apis" exact component={SwagUI}/>
    <Route path="/myaccount" exact component={MyAccount}/>
    <Route path="/myapps" exact component={MyApps}/>
    <Route path="/apis/:id" component={SwaggerAPI} />

    </Switch>

</div>    
  </BrowserRouter>

导航.jsx

    <ul class="navbar pull-right">
        <NavLink exact to="admindashboard"><li>Admin Dashboard</li></NavLink>
        <NavLink exact to="apis"><li>APIs</li></NavLink>
        <NavLink exact to="general"><li>General info</li></NavLink>
        <NavLink exact to="contactus"><li>Contact</li></NavLink>
        <NavLink exact to="myapps"><li>My Apps</li></NavLink>
        <NavLink exact to="faqs"><li>FAQs</li></NavLink>
        <NavLink exact to="notification"><li>Notifications</li></NavLink>
    </ul>

标签： javascriptreactjsreact-router

解决方案

我认为 NavLinksto属性应该以斜杠开头，以将其定义为路径而不是子路径。

现在无法测试以确认。

推荐阅读