Javascript React引导：`Nav`带有`fill`标志的`NavBar`工作不正常

正如标题所说，我希望我的

NavBar

扩展整个可用宽度，因此我在

NavBar

组件中添加了

fill

标志

  <Navbar bg="light" expand="lg">
    <Navbar.Toggle aria-controls="basic-navbar-nav" />
      <Navbar.Collapse id="basic-navbar-nav">
        <Nav fill className="mr-auto">
          <Nav.Link href="/">Home</Nav.Link>
          <Nav.Link href="/news">News</Nav.Link>
          <Nav.Link href="/ship-schedule">Ship Schedule</Nav.Link>
          <Nav.Link href="/media-sponsor">Media Sponsor</Nav.Link>
          <Nav.Link href="/contacts">Contacts</Nav.Link>
        </Nav>
      </Navbar.Collapse>
    </Navbar>

...
<Nav className="w-100 nav-justified">
...

家
新闻
船期
媒体赞助商
联络

但是它不工作，

Nav.Link

组件仍然是左对齐的

---

如何使那些

Nav.Link

组件填充

Nav.Bar

组件的宽度。

阅读引导API后，为了解决这个问题，我必须向

Nav

组件添加两个css类

  <Navbar bg="light" expand="lg">
    <Navbar.Toggle aria-controls="basic-navbar-nav" />
      <Navbar.Collapse id="basic-navbar-nav">
        <Nav fill className="mr-auto">
          <Nav.Link href="/">Home</Nav.Link>
          <Nav.Link href="/news">News</Nav.Link>
          <Nav.Link href="/ship-schedule">Ship Schedule</Nav.Link>
          <Nav.Link href="/media-sponsor">Media Sponsor</Nav.Link>
          <Nav.Link href="/contacts">Contacts</Nav.Link>
        </Nav>
      </Navbar.Collapse>
    </Navbar>

...
<Nav className="w-100 nav-justified">
...

---

你能提供一个在线演示吗？因为很难重现你所遇到的一切。我认为这对其他人也有很大的帮助。@keikai我已经找到了解决我问题的办法。