Symfony环境下，如何在Twig中从JSON数组设置变量？

我之前也踩过这个Twig和JSON变量赋值的坑，咱们一步步来捋清楚怎么解决！

首先先确认一个前提：Symfony传给Twig的JSON数组，是不是已经被自动解析成Twig能直接用的数组/对象了？如果控制器里你传的是PHP数组（或者用json_decode解析过的对象），那Twig里直接就能用；如果传的是JSON字符串，那得先解析。

正确的Twig变量赋值方式 #

如果你的JSON数据已经是Twig可识别的数组/对象，直接用{% set %}标签就能赋值：

{# 假设Symfony传的变量叫`jsonData`，是一个关联数组 #}
{% set targetVariable = jsonData['keyName'] %}
{# 或者用点语法，如果键名符合Twig的变量命名规则 #}
{% set targetVariable = jsonData.keyName %}

{# 如果是索引数组，直接用下标 #}
{% set firstItem = jsonData[0] %}

常见的踩坑点 #

1. 混淆Twig和JS变量
   因为Twig渲染优先级比JS高，很多人会不小心把两者的变量逻辑搞混。如果是想把Twig里的JSON值传给JS变量，一定要用json_encode过滤器，避免语法错误和XSS风险：

   <script>
       // 把Twig变量转成合法的JS变量
       const jsVar = {{ jsonData.keyName|json_encode(constant('JSON_HEX_TAG')) }};
   </script>
   

2. JSON还是字符串？
   如果Symfony传给你的是原始JSON字符串（比如没经过json_decode），那得先在Twig里解析：

   {% set parsedData = jsonString|json_decode %}
   {% set targetVariable = parsedData.keyName %}
   

3. 键名匹配问题
   检查你的JSON键名和Twig里用的是不是完全一致，比如JSON里是user_name，Twig里就不能写成userName，反之亦然。

举个完整的例子 #

假设控制器里是这么传数据的：

// Symfony Controller
$responseData = [
    'status' => 'success',
    'content' => ['title' => 'Hello Twig', 'desc' => '解决变量赋值问题']
];
return $this->render('demo.html.twig', ['apiData' => $responseData]);

Twig里设置变量并使用：

{# 设置变量 #}
{% set pageStatus = apiData.status %}
{% set pageTitle = apiData.content.title %}

{# 页面上渲染 #}
<h1>{{ pageTitle }}</h1>
<p>状态：{{ pageStatus }}</p>

{# 传给JS #}
<script>
    const pageDesc = {{ apiData.content.desc|json_encode }};
    console.log(pageDesc);
</script>

记住核心逻辑：Twig是服务器端渲染，所有变量赋值都是在服务器完成的，JS是客户端执行，所以Twig变量可以传给JS，但JS没法反向影响Twig的变量赋值哦！

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