You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Django中循环展示静态产品图片失败,如何解决?

问题描述

我希望通过循环展示存储在static/images目录下的产品图片,数据库中使用CharField字段存储图片名称。以下是我的配置代码:

settings.py

STATICFILES_DIRS = [
   BASE_DIR / 'static',
]
STATIC_URL = 'static/'
LOGIN_REDIRECT_URL='account:profile'
LOGIN_URL='account:login'

models.py

class Product(models.Model):
    name=models.CharField(max_length=70,blank=True,null=True)
    price=models.IntegerField()
    image=models.CharField(max_length=100,blank=True,null=True)

模板代码(误标注为views.py)

{% load static %}
{% for product in products %}
   <div class="card">
     <div class="card-image">
        <img src="{% static 'images/{{product.image}}' %}">
    </div>
   </div>
{% endfor %}

目前图片无法正常显示,请问该如何解决?


解决方法

问题核心是模板中static标签的用法错误:Django模板标签不能嵌套使用,你在{% static %}内部写的{{ product.image }}会被当成字符串直接解析,而非读取变量值。

修正模板的图片路径写法即可,以下是两种正确方式:

方式一:使用模板过滤器拼接路径

{% load static %}
{% for product in products %}
   <div class="card">
     <div class="card-image">
        <img src="{% static 'images/'|add:product.image %}">
    </div>
   </div>
{% endfor %}

方式二:拆分static标签与变量

{% load static %}
{% for product in products %}
   <div class="card">
     <div class="card-image">
        <img src="{% static 'images/' %}{{ product.image }}">
    </div>
   </div>
{% endfor %}

额外注意事项

  • 确认数据库image字段存储的是纯文件名(如shirt.jpg),不要带images/前缀,否则会生成images/images/shirt.jpg这类错误路径。
  • 检查static/images目录下是否存在对应文件,文件名需和数据库存储的完全一致(Linux环境下文件名区分大小写)。
  • 生产环境部署时,需执行python manage.py collectstatic命令,将静态文件收集到STATIC_ROOT指定的目录。

内容的提问来源于stack exchange,提问作者Pathia Nanto

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.08 04:35:28