react-router 没有将我发送到正确的组件

Question

当我尝试转到“shop/checkout/”时，我得到了“/:current/:project”（我得到的是 ProjectPage 而不是 CheckoutPage）我究竟做错了什么？ “/:current”来自设计组件。

      <Switch location={location}>
      <Route exact path="/design" component={Design} />
      <Route exact path="/shop" component={Shop} />
      <Route exact path="/:current/:project" component={ProjectPage}/>
      <Route exact path="/shop/checkout" component={CheckoutPage}/>
      </Switch>

      design page:
      <Link to={`${useLocation().pathname}/${title}`} />
      //useLocation = "/design", ${title} is a project name, im maping through projects and when the user click a project it uses the name of the project to the url

      shop:
      <Link to="/shop/checkout">CHECKOUT</Link>

Answer 1

因为shop和checkout是作为参数读取的。然后它呈现 ProjectPage 组件。

只需将 /shop/checkout 路由放在带参数的动态路由之前。

<Switch location={location}>
  <Route exact path="/design" component={Design} />
  <Route exact path="/shop" component={Shop} />
  <Route exact path="/shop/checkout" component={CheckoutPage}/>
  <Route exact path="/:current/:project" component={ProjectPage}/>
 </Switch>

react-router 没有将我发送到正确的组件

react-router doesn't send me to the right component

javascript

routes

reactjs

react-router