在Eleventy中如何用Liquid或JavaScript遍历含嵌套子集合的YAML集合

嵌套列表遍历实现方法 #

原生Liquid没有专门针对嵌套列表检测的内置过滤器，但完全不需要自定义JavaScript过滤器，只用Liquid自带的基础语法就能实现你的需求。

你的YAML结构被Liquid解析后，带有子项的顶层条目会被识别为数组，没有子项的条目就是普通字符串。你可以通过判断条目类型的方式触发嵌套遍历，以下是可直接使用的模板代码：

<h1>杂货清单</h1>
<ul>
{% for item in groceries %}
  {% if item.first %}
    <!-- 匹配到带嵌套子项的分类 -->
    <li>{{ item[0] }}
      <ul>
        {% for sub_item in item[1] %}
        <li>{{ sub_item }}</li>
        {% endfor %}
      </ul>
    </li>
  {% else %}
    <!-- 无嵌套的单独条目直接输出 -->
    <li>{{ item }}</li>
  {% endif %}
{% endfor %}
</ul>

如果你的嵌套层级超过2级，也可以用Liquid的include语法写递归模板片段实现无限层级遍历，同样不需要额外的自定义过滤器。

内容的提问来源于stack exchange，提问作者mike