如何在 Jekyll 中打乱数组的顺序？答案

【问题标题】：How do I shuffle the order of an array in Jekyll?如何在 Jekyll 中打乱数组的顺序？
【发布时间】：2014-11-27 22:17:22
【问题描述】：

具体来说，我希望在每次生成数组时在页面上以随机顺序列出数组的内容。

因此，给定page.array = [1, 2, 3] 以下内容：

{% for i in page.array %}
  <p>{{ i }}</p>
{% endfor %}

<!-- 
  Yields:
  <p>1</p>
  <p>2</p>
  <p>3</p>
-->

如何随机化该顺序？（希望语法类似于以下）

{% for i in page.array.shuffle %}
  <p>{{ i }}</p>
{% endfor %}

<!--
  Yielding something like this, or a random reordering:
  <p>3</p>
  <p>1</p>
  <p>2</p>
-->

【问题讨论】：

标签： ruby jekyll liquid

【解决方案1】：

我设法通过 Jekyll 的插件系统添加自定义过滤器来实现这一点：

# _plugins/shuffle.rb
module Jekyll
  module ShuffleFilter
    def shuffle(array)
      array.shuffle
    end
  end
end

Liquid::Template.register_filter(Jekyll::ShuffleFilter)

并使用：

{% assign shuffled_array = page.array | shuffle %}
{% for i in shuffled_array %}
  <p>{{ i }}</p>
{% endfor %}

【讨论】：

我这辈子都不知道如何安装这个插件。任何指导将不胜感激。
@bryan 使用 jekyll v3.6.2 我所要做的就是将自定义过滤器放入_plugins 中的文件中，例如。 _plugins/shuffle.rb
有没有办法只使用 GitHub Pages gem 中的 Jekyll 插件来实现相同的功能？ Github-pages 不支持自定义插件。
如果您知道可以使用sample 过滤器的长度，但我不知道动态数组长度的任何方法。

【解决方案2】：

currently accepted answer 使用自定义过滤器，但这在一些常见的 Jekyll 环境中是不可能的，例如 GitHub Pages。

在 GitHub Pages 上工作的一个简单解决方法是使用 Jekyll's sample filter 并将数组的 size 传递给它。例如，这是一个 Markdown 格式的 Jekyll 模板，它将在每个 Jekyll 构建中以随机顺序打印您的 Jekyll 博客文章的标题：

---
title: Posts in random order
---

{% assign n = site.posts | size %}
{% assign posts = site.posts | sample: n %}
{% for post in posts %}
    * {{ post.title }}
{% endfor %}

【讨论】：

【解决方案3】：

在尝试了这里讨论的解决方案后，我意识到使用 JS 会更好，因为我可以随时动态地打乱列表。它很容易实现。这是一个例子：

html

<div id="my-list">
  {% for i in page.array %}
    <p>{{ i }}</p>
  {% endfor %}
</div>

var myList = document.querySelector('#my-list');
for (var i = myList.children.length; i >= 0; i--) {
    myList.appendChild(myList.children[Math.random() * i | 0]);
}

参考：javascript - shuffle HTML list element order

【讨论】：