Docpad：动态获取 collection 项

Question

我是 docpad 的新手。我的项目中有类似过滤器的东西。很少有切换器可以过滤图标列表。用户单击图标后，应显示有关所选项目的详细信息。此项在 docpad collection 中。如何实施？列表中的每个图标都有一个 id，它等于 docpad collection 中响应项目的 id。有什么方法可以将所选项目的 ID 存储在变量 onclick 中（以便在生态模板中的 getCollection 或 getFileById 过滤器中使用它）？

Answer 1

我不清楚你想要达到什么目的。如果你想通过用户点击过滤页面上的项目，类似于 masonry/pinterest 布局，那么方法是将所有集合项目输出到页面，然后使用客户端 JavaScript 过滤它们。如果你想在用户点击一个项目时显示更多的细节，原理是一样的。将集合的所有详细信息输出到页面，但仅在用户单击项目时才显示完整详细信息（再次使用客户端脚本）。

现在，如果集合太大或内容太长而无法输出到页面并且您需要在 post 上生成内容（即动态），那么页面可以被标记为 dynamic = true 在元数据中。您还需要安装 clean urls plugin

编辑：

作为使用 eco 模板系统在动态生成的页面上过滤集合的示例。

---
layout: simple
dynamic: true
---

<%collection = ['Aardvark',"Arrows","Armageddon","Buildings","Bats","Bob the builder"] %>
<%query = @req.query%>
<%-query.q%>
<%filter = query.q%>
<h1><%-(new Date()).toString()%></h1>
<ul>
<% for item in collection:%>
<%if item[0].toLowerCase() == filter or !filter:%>
    <li><%-item%></li>
<%end%>
<%end%>
</ul>

这里假设有一个查询参数，形式为q=a或q=b等。即http://127.0.0.1:9778/?q=a。我还写下了日期，以证明该页面在每次请求时都会重新生成。

查看 DocPad 文档的 metadata section。

Docpad：动态获取 collection 项

Docpad: get collection item dynamically

eco

docpad