Malla文档
首页快速入门打开 Malla

集合列表

为查询或数组中的每个条目重复一次模板，支持空状态和分页。

用户指南

集合列表会为数据源中的每个条目重复一次它的第一个子元素。你只需设计一张卡片，剩下的交给列表；其中的每个绑定都可以使用 item 和 index。

设置列表

  1. 插入列表

    在插入菜单的 CMS 分组中选择 Collection list。它默认使用你的第一个 CMS 集合；如果站点还没有集合，则使用页面的第一个查询。只有当站点已有 CMS 集合或查询时，菜单中才会出现这个选项。可以像设置任何框架一样设置列表的样式；卡片用网格布局效果很好。

  2. 选择数据源

    CMS query 列出某个集合的条目，支持筛选、排序和数量限制（最多 100 个）。Expression 可以重复任意数组，例如 queries.products.data 或 vars.cart。

  3. 绑定模板

    把第一个子元素中的文本、图片和链接绑定到 item.*。用 index 编号，在嵌套列表中用 parent.item。

  4. 处理空结果

    设置没有条目时显示的 empty state text。

json
"n_list": {
  "type": "collectionList",
  "children": ["n_card"],
  "props": {
    "query": {
      "collectionId": "col_posts",
      "filter": [{ "field": "featured", "op": "eq", "value": true }],
      "sort": [{ "field": "publishedAt", "dir": "desc" }],
      "limit": 6
    }
  }
}

把每个条目链接到它的页面

要让每张卡片打开自己的页面，集合需要一个模板页面，例如 /blog/:slug。

  1. 把卡片变成链接

    选中第一个子元素里的元素，右键选择 Wrap in link。也可以在第一个子元素中插入一个 Link block，把内容移进去。第一个子元素本身不能被包裹。

  2. 绑定 URL

    选中链接。在 Link 分区中，点击 Bound URL 行上的 ，在 Item page 下选择模板页面。引用字段会添加它们自己的页面，例如 Author page。

这个选项会根据页面路径写出一个普通表达式，所以 /blog/:slug 会变成 `/blog/${item.slug}`。需要时可以手动修改它。条目里的按钮也可以用同样的方式链接。

筛选和排序

CMS 筛选使用 eq、neq、gt、gte、lt、lte、contains、in 和 exists 把字段与某个值进行比较。值可以绑定，例如绑定到一个分类变量，这样访客筛选时列表就会更新。

为条目添加动画

在交互中以卡片为目标，每个重复的条目都会产生动画。添加交错效果即可形成级联。