Question

我正在一个网站上工作，作为一个相对较新的React开发人员，我遇到了有关路由器链接的问题

我用精确路由，hrefs（不是我的首选方式）尝试了多种方法，我用Google搜索了很多东西，做了其他我不记得的事情。

所以，这是按钮代码

<Link to={"/cases/" + ConvertToPageUrl(_project.title)}>
  <p className="portfolio-item__icon mx-auto text-white m-0 mt-3">
    <FontAwesomeIcon icon={faExpandArrowsAlt} />
  </p>
</Link>

这些是路线

<Switch>
  <Route exact path="/" component={Home} />
  <Route path="/wiezijnwij" component={WieZijnWij} />
  <Route path="/diensten" component={Diensten} />
  <Route exact path="/cases" component={Cases} />
  <Route path="/cases/:case" component={Case} />
  <Route path="/contact" component={Contact} />
  <Route component={NotFound} />
</Switch>

最后，这是导航栏

<Nav className="ml-auto">
  {nlRouting.map((route, index) => {
    return (
      <LinkContainer to={route.dest} exact={route.exact} key={index}>
        <Nav.Link eventKey={index}>{route.text}</Nav.Link>
      </LinkContainer>
    );
  })}
</Nav>

nlRouting是所有路线的地图

这是发生了什么： Result

我希望只有navlink Cases能够激活，而不是它所来自的页面。

Answer 1

我发现了，导航链接没有更新。我通过添加

对其进行了修复

active={false}

到每个Nav.Link，这会使它更新。

我的React Router <链接到>正在激活多个链接

1 个答案: