React Bootstrap NavDropdown alignRight 不起作用

Question

我正在使用 react bootstrap 并尝试将 NavBar 菜单向右对齐

            <Nav className="ml-auto paddingLeft5" alignRight>
                <NavDropdown title="Account" id="basic-nav-dropdown" alignRight>
                    <NavDropdown.Item href="/privacySettings">Privacy Settings</NavDropdown.Item>
                    <NavDropdown.Item href="/signOut">Sign Out</NavDropdown.Item>
                </NavDropdown>
                <NavDropdown title="Help" id="basic-nav-dropdown" alignRight>
                    <NavDropdown.Item href="/contactUs">Contact us</NavDropdown.Item>
                    <NavDropdown.Item href="/termsAndConditions">Terms and Conditions</NavDropdown.Item>
                </NavDropdown>
            </Nav>

然而，这似乎不起作用。我正在使用“react-bootstrap”：“^1.0.0-beta.10”、“react-dom”：“^16.8.4”和“bootstrap”：“^4.3.1”。

结果可以在附图中看到。

我无法将菜单向右对齐，任何帮助将不胜感激。

Answer 1

import { Navbar, Nav, NavDropdown } from 'react-bootstrap'
<Nav className="ml-auto">
<NavDropdown alignRight title="Profile" id="collasible-nav-dropdown" >
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
<NavDropdown.Item href="#action/3.2">Another action</NavDropdown.Item>
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Item href="#action/3.4">Separated link</NavDropdown.Item>
</NavDropdown>
</Nav>

使用命令手动终止端口号，netstat -ntlp然后使用kill -9 <port number>并使用npm start.