Nunjucks表格渲染：如何在循环中免手动索引获取另一数组值

你当前通过手动指定columns索引的方式虽然可行，但扩展性差——如果columns数组新增或删除字段，就得修改模板里的索引和对应属性。可以通过嵌套循环实现完全动态的渲染，无需手动维护索引：

优化后的模板代码 #

{%- for item in rows -%}
<tr>
  {%- for column in columns -%}
    <td data-cell="{{ column.header }}">{{ item[column.key] }}</td>
  {%- endfor -%}
</tr>
{%- endfor -%}

原理说明 #

• 外层循环遍历每一行数据rows
• 内层循环遍历每一列配置columns：
  • 用column.header填充data-cell属性值
  • 用item[column.key]动态获取当前行对应列的字段值（利用JavaScript对象的属性访问语法，通过字符串key获取属性）

这种方式的优势：

• 完全适配columns数组的变化，新增/删除列时无需修改模板
• 代码更简洁，减少重复冗余
• 保持数据与模板的解耦，符合模板引擎的设计思路

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