Javascript 使用Nav组件的React引导刷新应用程序

我试着使用简单链接和引导类，如下图所示，效果很好

<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
      <ul class="navbar-nav">
        <li class="nav-item">
          <Link class="nav-link" to="/">
            Home
          </Link>
        </li>
        <li class="nav-item">
          <Link class="nav-link" to="/login">
            Login
          </Link>
        </li>
        <li class="nav-item">
          <Link class="nav-link" to="/product">
            Product
          </Link>
        </li>
        <li class="nav-item">
          <Link class="nav-link" to="/product/3">
            Details
          </Link>
        </li>
      </ul>
</nav>

---

尝试使用

Nav.Link

和

as={Link}

，

to

，而不是像下面这样的

href

道具：

从'react router dom'导入{Link}
...

工作示例

<Nav defaultActiveKey="/" as="ul">
      <Nav.Item as="li">
        <Nav.Link href="/">Home</Nav.Link>
      </Nav.Item>
      <Nav.Item as="li">
        <Nav.Link href="/login">Login</Nav.Link>
      </Nav.Item>
      <Nav.Item as="li">
        <Nav.Link href="/product">Product</Nav.Link>
      </Nav.Item>
</Nav>