reactstrap 导航栏下拉菜单不向右移动

Posted 2023-03-23

【中文标题】reactstrap 导航栏下拉菜单不向右移动

【英文标题】：reactstrap navbar dropdown doesnt shift right

【发布时间】：2021-08-08 08:42:27

【问题描述】：

import Navbar, NavbarBrand,NavbarToggler, Nav,NavItem, NavLink, UncontrolledDropdown, DropdownToggle, DropdownItem, DropdownMenu, Collapse from 'reactstrap'

<Navbar color='dark' dark expand='md'>
<NavbarBrand>
      My blog

 </NavbarBrand>
<NavbarToggler onClick=this.toggle/>

<Collapse isOpen=this.state.isOpen navbar>
     <Nav className='mr-auto' navbar>
              <NavItem>
             <NavLink href="/">
                       link
             </NavLink>
              </NavItem>
    </Nav>
<UncontrolledDropdown>
      <DropdownToggle nav caret>
      options
       </DropdownToggle>
     <DropdownMenu right>
            <DropdownItem>
             Option 1
             </DropdownItem>
             <DropdownItem>
             login
             </DropdownItem>
        <DropdownItem divider />
               <DropdownItem>
                 logout
              </DropdownItem>
          </DropdownMenu>
 </UncontrolledDropdown>
 </Collapse>
</Navbar>

在这个导航栏中，我有<DropdownMenu right>，但它仍然在左侧

我是新手，因此对如何解决这个问题一无所知。可以请我帮忙吗？

【参考方案1】：

尝试将ml-auto 类添加到UncontrolledDropdown 组件。

<UncontrolledDropdown className="ml-auto">

【讨论】：

还是没变。

试试<Nav className='ml-auto' navbar>而不是<Nav className='mr-auto' navbar>

改变了它，但它仍然没有向右移动。很抱歉占用您的时间。

请查看this。

我删除了我的整个代码，只是复制粘贴了他们的，但它仍然在左边。