0

我尝试使用 Jekyll 构建文档站点,并认为将主要链接存储在 JSON 数据文件中可能是个好主意。

这是 JSON 文件:

{
    "home": {
        "name": "Home",
        "path": "/",
        "icon": "fas fa-home"
    },
    "faq": {
        "name": "FAQ",
        "path": "/faq",
        "icon": "fas fa-question"
    },
    "manuals": {
        "name": "Anleitungen",
        "path": "/manuals",
        "icon": "fas fa-book-open"
    }
}

这是我的模板(部分):

        <div class="navbar-menu">
            <div class="navbar-start">
                {% for rubrik in site.data.navigation %}
                {% for part in rubrik %}
                <a class="navbar-item{% if page.url == part.path %} is-active{% endif %}" href="{{ part.path }}">
                    <span class="icon"><i class="{{ part.icon }}"></i></span><span>{{ part.name }}</span>
                </a>
                {% endfor %}
                {% endfor %}
            </div>
        </div>

这实际上产生了这个输出:

       <div class="navbar-menu">
            <div class="navbar-start">


                <a class="navbar-item" href="">
                    <span class="icon"><i class=""></i></span><span></span>
                </a>

                <a class="navbar-item is-active" href="/">
                    <span class="icon"><i class="fas fa-home"></i></span><span>Home</span>
                </a>



                <a class="navbar-item" href="">
                    <span class="icon"><i class=""></i></span><span></span>
                </a>

                <a class="navbar-item" href="/faq">
                    <span class="icon"><i class="fas fa-question"></i></span><span>FAQ</span>
                </a>



                <a class="navbar-item" href="">
                    <span class="icon"><i class=""></i></span><span></span>
                </a>

                <a class="navbar-item" href="/manuals">
                    <span class="icon"><i class="fas fa-book-open"></i></span><span>Anleitungen</span>
                </a>


            </div>
        </div>

您会看到输出加倍,一次是外循环的空变量,其次是内循环的正确值。

有什么提示吗?这是一个错误还是我只是用错了?还没有看到任何关于 for 循环仅用于一个级别的建议。例如 Jinja2 可以做到这一点。我使用的 Jekyll 版本是 4.0(最新)。

提前谢谢了。

问候,托马斯

4

1 回答 1

0

当你循环进入site.data.navigation时,循环返回一个数组,如["home", {"name"=>"Home", "path"=>"/", "icon"=>"fas fa-home"}].

如果你尝试这段代码,你肯定会明白发生了什么。

{% for rubrik in site.data.navigation %}
  <p>rubrik = {{ rubrik | inspect }}</p>
  <ul>
  {% for part in rubrik %}
    <li>part = rubrik[{{ forloop.index0 }}] = {{ part | inspect }}</li>
  {% endfor %}
  </ul>
{% endfor %}

在您的情况下,您可以像这样简单地定位rubrik[1]元素:

<div class="navbar-menu">
  <div class="navbar-start">
    {% for rubrik in site.data.navigation %}
    {% assign p = rubrik[1] %}
    <a class="navbar-item{% if page.url == p.path %} is-active{% endif %}" href="{{ p.path }}">
      <span class="icon"><i class="{{ p.icon }}"></i></span><span>{{ p.name }}</span>
    </a>
    {% endfor %}
  </div>
</div>
于 2019-09-30T14:59:44.420 回答