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

【问题标题】：react-router doesn't send me to the right componentreact-router 没有将我发送到正确的组件
【发布时间】：2021-11-09 09:37:00
【问题描述】：

当我尝试转到“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>

【问题讨论】：

字面路由不是要走在可变路由之前吗？否则shop 和checkout 可以被读取为参数？

标签： javascript reactjs routes react-router

【解决方案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>

【讨论】：