将数组传递给包含以循环

Question

我有一个 include，它可以有 >1 个按钮，具体取决于传入的内容。

目前我有以下内容：

{% if include.buttons %}
   {% for button in include.buttons %}
      <a class="{{ button.classes }}" href="{{ button.url }}">{{ button.title }}</a>
   {% endfor %}
{% endif %}

然后我尝试传入以下数据：

{% assign buttons = '[{ "title": "button 1", "url": "https://#", "classes": "btn btn-transparent" }, { "title": "button 2", "url": "https://#", "classes": "btn btn-primary" }]' %}
{% include header.html
   buttons=buttons
%}

我无法解决的是如何将数据正确地传递给 include 以便我可以循环遍历它。

Answer 1

问题是数据作为数组的赋值。在液体中你不能直接initialize arrays. A workaround is to play with split。

但是，使用 jekyll，您可以通过 data files 提供数组。只需将您的按钮放在一个文件中，例如 _data\buttons.yml 和：

postXX:
  - button1:
    - title: "button 1"
    - url: "https://#"
    - classes: "btn btn-transparent"
  - button2:
    - title: "button 2"
    - url: "https://#"
    - classes: "btn btn-primary"

现在您可以在 post/page 的 yaml-header 中添加一个引用，例如：

---
your other yaml options....
buttons: postXX
---

最后，分配按钮并像您在代码中那样包含它们。

{% assign buttons = site.data.buttons[page.buttons] %}
{% include header.html
   buttons=buttons
%}

Answer 2

使用 Liquid，您无法使用 {% assign myArray = ["one","two","three"] %}.

这样的文字表达式创建数组

您只能:

创建一个空的：{% assign emptyArray = "" | split: "" %}
从字符串创建一个：{% assign myArray = "one two three" | split: " " %}

然后您可以操作数组：

向数组添加一个元素：push 或 shift (jekyll specific filters)
从数组中删除一个元素：pop 或 unshift (jekyll specific filters)
合并两个数组concat
等等...

因此，您的数组只能来自液体数组操作或配置、数据文件或页面前端中包含的某些数据。

将数组传递给包含以循环

Pass an Array to an include to loop over

liquid

jekyll