如何将JSON数据渲染并展示到Django模板中

首先你需要在view.py中把加载完成的products变量传入模板上下文，示例代码如下：

# view.py 中返回响应的部分示例
return render(request, "你的模板文件名.html", {"products": products})

模板直接遍历方案 #

Django模板支持直接遍历字典的键值对，你可以直接用如下代码展示商品信息：

{% for product_id, product_attrs in products.items %}
<div class="product-card">
  <p>*商品ID*：{{ product_id }}</p>
  <ul>
    <li>商品名称：{{ product_attrs.1 }}</li>
    <li>商品售价：{{ product_attrs.2 }} 元</li>
    <li>库存数量：{{ product_attrs.0 }}</li>
  </ul>
</div>
{% empty %}
<p>暂无商品数据</p>
{% endfor %}

说明：

• 数组的索引从0开始，你可以根据自己实际的字段定义调整对应索引位置
• {% empty %} 分支用于处理products为空的场景，可根据需求删除或修改

优化方案（可选） #

如果不想在模板里记索引，可以先在view层把数据处理成语义化的字典结构，后期维护更方便：

# view.py 中json.loads之后添加处理逻辑
products = json.loads(data)
processed_products = []
for pid, attrs in products.items():
    processed_products.append({
        "id": pid,
        "stock": attrs[0],
        "name": attrs[1],
        "price": attrs[2]
    })
# 传入上下文的时候用处理后的数据
return render(request, "你的模板文件名.html", {"products": processed_products})

对应模板代码就可以写得更清晰：

{% for product in products %}
<div class="product-card">
  <p>*商品ID*：{{ product.id }}</p>
  <ul>
    <li>商品名称：{{ product.name }}</li>
    <li>商品售价：{{ product.price }} 元</li>
    <li>库存数量：{{ product.stock }}</li>
  </ul>
</div>
{% empty %}
<p>暂无商品数据</p>
{% endfor %}

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