Accordion Menu de barre à l'aide de Nav composants avec réagissent-bootstrap
Je suis commencé à construire mon INTERFACE utilisateur à l'aide react-bootstrap
et maintenant, il est une tâche importante pour moi de créer SideBar Menu Accordéon en utilisant la norme bootstrap
composants. J'ai trouvé cette exemple qui utilise panel-group
et table
, mais je pense que ce n'est pas la meilleure façon, car nav
est mieux de la façon naturelle pour les composants de navigation.
Je veux que mon menu de barre de code ressemble à ceci (react-bootstrap
composant):
<Nav bsStyle="pills" stacked>
<NavItem title="Item 1">
<Nav bsStyle="pills" stacked>
<NavItem title="Sub Item 1">Sub Item 1</NavItem>
<NavItem title="Sub Item 2">Sub Item 2</NavItem>
<NavItem title="Sub Item 3">Sub Item 3</NavItem>
</Nav>
</NavItem>
<NavItem title="Item 2">Item 2</NavItem>
<NavItem title="Item 3">Item 3</NavItem>
</Nav>
Des suggestions avec react-bootstrap
ou tout simplement bootstrap
sera utile.
OriginalL'auteur Sergey Bespalov | 2016-10-11
Vous devez vous connecter pour publier un commentaire.
J'ai trouvé pure
nav
solution. Donc peut-être que ça peut aider quelqu'un d'autre. La solution est d'utiliser une "norme" réagissent-bootstrap " les composants, tels queNavbar
, en combinaison avecbootstrap
css personnalisation.Exemple de code ci-dessous:
SideBarMenu.jsx
sideBarMenu.css
Noter que je suis en utilisant
webpack
en combinaison aveccss-loader
modules de portée, de sorte:global
signifiebootstrap
nom de classe css..gif
image sera beaucoup mieux!pourquoi??
panneau de gauche est à quai?
oui. C'est
position: fixed
OriginalL'auteur Sergey Bespalov