Kann ich nicht mehr als einen NavDropdown verwenden?

Question

Ich habe den folgenden Code in meinem Navbar verschachtelt:

<Navbar inverse collapseOnSelect fixedTop fluid> 
    <Navbar.Collapse> 
    <Nav onSelect={this.props.onSelect} pullRight> 
     <NavItem eventKey={'navItem1'}>NavItem 1</NavItem> 
     <NavItem eventKey={'navItem2'}>NavItem 2</NavItem> 

     <NavDropdown eventKey={'dropdown1'} title="Dropdown1" id="basic-nav-dropdown"> 
     <MenuItem eventKey={'placeholder1'}>Placeholder</MenuItem> 
     <MenuItem divider /> 
     <MenuItem eventKey={'placeholder2'}>Placeholder</MenuItem> 
     </NavDropdown> 

     <NavDropdown eventKey={'dropdown2'} title="Dropdown2" id="basic-nav-dropdown-2"> 
     <MenuItem eventKey={'placeholder3'}>Placeholder</MenuItem> 
     <MenuItem divider /> 
     <MenuItem eventKey={'placeholder4'}>Placeholder</MenuItem> 
     </NavDropdown> 

     <NavDropdown eventKey={'dropdown3'} title="DropDown3" id="basic-nav-dropdown-3"> 
     <MenuItem eventKey={'placeholder5'}>Placeholder</MenuItem> 
     <MenuItem divider /> 
     <MenuItem eventKey={'placeholder6'}>Placeholder</MenuItem> 
     </NavDropdown> 
    </Nav> 
    </Navbar.Collapse> 
</Navbar> 

Das Problem, das ich bin vor, dass nur Auswahlliste1 die Drop-down zeigt. Wenn Sie sich das Problem mit meinen ChromeTools ansehen, scheint es, dass in den anderen beiden Dropdown-Listen die Klasse "open" nicht hinzugefügt wird.

Irgendwelche Ratschläge?

Answer 1

Ihre NavDropdown-Komponenten selbst haben keine Ereignisschlüssel, sie haben nur einen Titel und einen ID-Wert. Es sollte so sein:

<NavItem eventKey={1}>NavItem 1</NavItem> 
    <NavItem eventKey={2}>NavItem 2</NavItem> 

    <NavDropdown eventKey={3} title="Dropdown1" id="basic-nav-dropdown"> 
    <MenuItem eventKey={3.1}>Placeholder</MenuItem> 
    <MenuItem divider /> 
    <MenuItem eventKey={3.2}>Placeholder</MenuItem> 
    </NavDropdown> 

    <NavDropdown eventKey={4} title="Dropdown2" id="basic-nav-dropdown-2"> 
    <MenuItem eventKey={4.1}>Placeholder</MenuItem> 
    <MenuItem divider /> 
    <MenuItem eventKey={4.2}>Placeholder</MenuItem> 
    </NavDropdown>