Unable Bootstrap Klassen in Reactstrap Navbar Komponente

Question

Ich bin mit dem Reactstrap Implementierung von Bootstrap 4 auf einem Knoten-Anwendung verwenden und versuchen, eine navbar Komponente zu machen folgende JSX mit:

return (
     <Navbar color="inverse" inverse toggleable={`md`} fixed={`top`} className="h-50"> 
      <NavbarToggler right onClick={this.toggle} /> 
      <NavbarBrand href="/">reactstrap</NavbarBrand> 
      <Collapse isOpen={this.state.isOpen} navbar> 
      <Nav className="ml-auto" navbar> 
       <NavItem> 
       <NavLink href="/components/">Components</NavLink> 
       </NavItem> 
       <NavItem> 
       <NavLink href="https://github.com/reactstrap/reactstrap">Github</NavLink> 
       </NavItem> 
      </Nav> 
      </Collapse> 
     </Navbar> 
    ); 

Aber wenn die Komponente macht, es springt der Klasse I (h-50) vollständig hinzugefügt:

<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse fixed-top">...</nav> 

die Reactstrap documentation gibt eine Liste von Requisiten eine für die meisten der Stammkunden nutzen können wie navbar-inverse, navbar-faded, etc., aber keine für benutzerdefinierte Klassen wie die, die ich habe. Irgendwelche Vorschläge?

Answer 1

Einfach den Wert von className in { ... }, wie folgt aus:

<Navbar color="inverse" inverse toggleable={`md`} fixed={`top`} 
className={"h-50"}> 
    ... 
</Navbar>