'How to keep react-pro-sidebar submenus open when routing happened?
I am using react-pro-sidebar. Menu hierarchy works as expected.
When I click all its submenus are shown. In the submenus I have routing. So when I click anyone of the submenus, all the whole menus are getting collapsed. Looks its due to routing. Is it? If yes, How can prevent this?
My COde snippet
<ProSidebar
collapsed={collapsed}
toggled={toggled}
breakPoint="md"
onToggle={handleToggleSidebar}
>
<SidebarContent>
<Menu iconShape="circle">
<SubMenu title={'Submenu 1'} icon={<FaList />}>
<SubMenu title={`Submenu 1.1`} icon={<FaList />}>
<MenuItem icon={<FaList />}>
Menuitem 1.1
<Link to="/menuitem11" />
</MenuItem>
<MenuItem icon={<FaList />}>
MenuItem 1.2
<Link to="//menuitem12" />
</MenuItem>
<SubMenu title={`Submenu 1.1.1`} icon={<FaList />}>
<MenuItem icon={<FaList />}>
Menuitem 1.1.1.1
<Link to="/menuitem1111" />
</MenuItem>
<MenuItem icon={<FaList />}>
Menuitme 1.1.1.2
<Link to="/menuitem1111" />
</MenuItem>
</SubMenu>
</SubMenu>
</SubMenu>
</Menu>
<Menu iconShape="circle">
<SubMenu title={'Submenu 2'} icon={<FaList />}>
<MenuItem icon={<FaList />}>MenuItem211
<Link to="/menuitme21" /></MenuItem>
<SubMenu title={`Subment 2.1.1} icon={<FaList />}>
<MenuItem icon={<FaList />}>Menuitem3.2.1
<Link to="/menuItem31" /></MenuItem>
<MenuItem icon={<FaList />}>Menuitem3.2.2
<Link to="/menuItme32" /></MenuItem>
</SubMenu>
</SubMenu>
</Menu>
</SidebarContent>
</ProSidebar>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
