如何在Twig的index.twig中引入静态JSON并传递给include子模板

问题解决方法 #

你目前的代码存在两个核心问题：一是引入的JSON内容是纯字符串格式，Twig无法直接解析遍历；二是遍历路径不匹配JSON的实际结构，按以下步骤修改即可：

1. 修改入口Twig文件的JSON处理逻辑 #

引入JSON后需要通过json_decode过滤器将字符串解析为Twig可操作的结构化数据：

{% set raw_json %}
    {% include "content.json" %}
{% endset %}
{# 解析JSON，传入true参数会返回数组，默认返回对象，按需选择即可 #}
{% set json = raw_json|json_decode %}

{% include '@partials/blocks/site-header.twig' with {json:json} %}

2. 调整子模板的遍历逻辑 #

你的JSON外层包含headerNav字段，遍历需要指定到对应层级：

{% for headerNav in json.headerNav %}
<a class="button button--nav" href="#">
    {{ headerNav.text }}
</a>
{% endfor %}

如果后续切换其他JSON文件，只需调整子模板中遍历的字段名，即可适配不同的导航数据结构。

内容的提问来源于stack exchange，提问作者jna