Задача: создать многоуровневое меню (3 уровня), первый уровень которого будет представлять название категории товара.
Каркас nav.pug
ul each item,index in NAV li(class=index == 1 ? 'active':'') +link("#",item.level) a.open-submenu(href="#") if item.subnav.length > 0 ul.sub__nav for level1,index in item.subnav li ul: li(class=level1.subnav.length > 0 ?'parent':'') a(href="#")= level1.level if level1.subnav.length > 0 +link("#").nav-toggler ul for level2,index in level1.subnav li(class=level2.subnav.length > 0 ?'parent':'') +link("#",level2.level) if level2.subnav.length > 0 +link("#").nav-toggler ul for level3,index in level2.subnav li: +link("#",level3.level)
Данные для меню будем брать из nav.json
{ "NAV": [ { "level": "Акции", "subnav": [] }, { "level": "Техника для кухни", "subnav": [ { "level": "Техника для кухни", "subnav": [ { "level": "Чайники", "subnav": [ { "level": "С двойными стенками", "subnav": [] } ...
CSS по вкусу.