我是stencil的新手,我正试图在非顶级类别页面上获得顶级类别。我希望循环使用类别,但只打印顶层下面列出的项目。以下是我正在使用的内容,如果我在顶级页面上,但如果我在子类别页面上则不行。
{{#each categories}}
{{#if name '===' ../category.name}}
<li class="parent {{#if children}}has-children tier-dropdown{{/if}}">
<a href="{{url}}">{{name}}</a>
{{#if children}}
<ul class="children">
<li class="parent-all"><a href="{{url}}">{{lang 'common.navigation_all'}} {{name}}</a></li>
{{#each children}}
<li>
<a href="{{url}}">{{name}}</a>
{{#if children}}
<ul class="children2">
<li class="parent-all"><a href="{{url}}">{{lang 'common.navigation_all'}} {{name}}</a></li>
{{#each children}}
<li {{#if children}}class="tier-dropdown"{{/if}}>
<a {{#if children}}class="tier-toggle"{{/if}} href="{{url}}">{{name}}</a>
{{#if children}}
<ul class="tier-panel">
<li class="parent-all"><a href="{{url}}">{{lang 'common.navigation_all'}} {{name}}</a></li>
{{#each children}}
<li {{#if children}}class="tier-dropdown"{{/if}}>
<a {{#if children}}class="tier-toggle"{{/if}} href="{{url}}">{{name}}</a>
{{#if children}}
<ul class="tier-panel">
<li class="parent-all"><a href="{{url}}">{{lang 'common.navigation_all'}} {{name}}</a></li>
{{#each children}}
{{> components/common/site-navigation-submenus}}
{{/each}}
</ul>
{{/if}}
</li>
{{/each}}
</ul>
{{/if}}
</li>
{{/each}}
</ul>
{{/if}}
</li>
{{/each}}
</ul>
{{/if}}
</li>
{{/if}}
{{/each}}
强调的重点是第2行,因为if语句需要始终指向顶级类别,即使在子类别页面上也是如此。
我有关于使用面包屑但是无法想出在每个循环的类别中使用它的方法。
答案 0 :(得分:0)
没有纯粹的Stencil / Handlebars.js解决方案。您需要能够对BigCommerce没有帮助的父类别进行递归向上搜索。最佳解决方案是在页面加载期间重新设置项目或将项目添加到列表中。
您可以使用页面网址,具体取决于网址的结构,也可以使用您提到的面包屑。
TL; DR你需要javascript。