Django模板使用views定义的filepath做img src时首页不生效问题

你仅在项目详情页的视图函数project_details中定义了filepath变量并传入了模板上下文，项目首页对应的视图函数没有向首页模板传递该变量，因此模板渲染时找不到filepath，最终输出的src属性为空。

• 第一步：修改项目首页对应的视图函数，参照详情页的逻辑为每个项目生成对应的文件路径，示例代码如下：

# 假设你的首页视图函数为project_index，可根据实际名称调整
def project_index(request):
    projects = Project.objects.all()
    # 遍历所有项目，为每个实例拼接对应的图片路径
    for project in projects:
        project.filepath = "/static/img/" + project.title + ".png"
    context = {"projects": projects}
    return render(request, "projects/project_index.html", context)

• 第二步：调整首页模板的图片标签调用逻辑，循环渲染项目卡片时从单个项目实例中取路径，示例代码如下：

{% for project in projects %}
<div class="card">
  <img src="{{ project.filepath }}" class="card-img-top" alt="Project Image">
  <!-- 其余卡片内容 -->
</div>
{% endfor %}

不要硬编码静态文件路径，可改用Django原生的static模板标签，适配性更强：

1. 先在模板顶部引入静态文件标签：{% load static %}
2. 改写图片路径写法：

<img src="{% static 'img/'|add:project.title|add:'.png' %}" class="card-img-top" alt="Project Image">

后续如果调整了静态文件存储配置，不需要批量修改模板内的路径前缀。

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