在 Jekyll 中根据条件显示 JSON 数据

Display JSON data with criteria in Jekyll

我有一个 JSON 文件,其结构如下:

{
    "resources": [
        {
            "date": "Nov 7",
            "content": [
                {
                    "articleTitle":"The Distribution of Users’ Computer Skills: Worse Than You Think",
                    "articleUrl":"https://www.nngroup.com/articles/computer-skill-levels/?ref=boomkrak",
                    "articleAuthor": "Jakob Nielson",
                    "articleTag": "ux, web design"  
                },
                {
                    "articleTitle":"How to Use Animation to Improve UX",
                    "articleUrl":"https://uxplanet.org/how-to-use-animation-to-improve-ux-338819e93bdb#.84b3m022s?ref=boomkrak",
                    "articleAuthor": "Nick Babich",
                    "articleTag": "ux, animation"
                }
            ]
        },
        {
            "date": "Nov 15",
            "content": [
                {
                    "articleTitle":" 7 Things Every Designer Needs to Know about Accessibility",
                    "articleUrl":"https://medium.com/salesforce-ux/7-things-every-designer-needs-to-know-about-accessibility-64f105f0881b#.5pgg5014x?ref=boomkrak",
                    "articleAuthor": "Jesse Hausler",
                    "articleTag": "ux, web design, accessibility"   
                },
                {
                    "articleTitle":"Get the most out of your research with storytelling",
                    "articleUrl":"https://blog.intercom.com/get-the-most-out-of-your-research-storytelling/?ref=boomkrak",
                    "articleAuthor": "Jillian Wells",
                    "articleTag": "design research, collaboration"
                }
            ]
        }
    ]
}

我想根据每个标签显示文章。例如,如果我想显示 ux 篇文章,那么应该显示所有带有 ux 标签的文章。

有人知道如何在 Jekyll 中做到这一点吗?

考虑到您的数据位于 _datas/articles.json,您可以使用此包含文件 (_includes/listbyTag.html) :

{% assign tag = include.tag %}
{% assign days = site.data.articles.resources %}
{% assign list = ""| split: "/" %} {% comment %} creates an empty array {% endcomment %}

{% for day in days %}
  {% for article in day.content %}
    {% if article.articleTag contains tag %}
      {% assign list = list | push: article %}
    {% endif %}
  {% endfor %}
{% endfor %}

{% if list.size != 0 %}
  <h3>Found {{ list.size }} posts for tag : {{ tag }}</h3>
  <ul>
    {% for post in list %}
      <li>{{ post.articleTitle }}</li>
    {% endfor %}
  </ul>
{% endif %}

现在您可以将它包含在任何地方:

{% include listByTag.html tag="ux" %}

或者对于标签页:

---
tag: ux
title: my title
layout: default
---
{% include listByTag.html tag=page.tag %}