Django模板Block内容不渲染 访问页面空白问题咨询

问题背景 #

需求为在allposts.html模板中查询Post模型全量文章，political.html模板中查询分类为politics的政治类文章，两个子模板继承index.html基模板，分别填充基模板内预定义的allposts、content两个block区块，最终将两类文章展示在index页面不同分区。实际运行访问对应页面仅显示空白，无法定位故障。 #

核心故障原因 #

• 模板变量名不匹配：political.html内for循环迭代变量与内部引用变量不一致，导致内容无法渲染
• 静态标签未加载：allposts.html使用了{% static %}标签但未提前加载静态模板标签，触发模板渲染错误
• 模板继承逻辑理解错误：Django单次请求仅能渲染一个模板，无法同时拼接两个子模板的block内容到基模板，且根路由对应的index视图未传入任何文章数据，访问首页时两个block均为空
• 路由顺序存在隐患：动态参数路由位置靠前，存在拦截固定路径的风险

具体修复方案 #

1. 修正视图层逻辑 #

如果需要在首页同时展示两类文章，不需要拆分两个子模板分别继承，直接在index视图中查询两类数据传入模板即可，修改views.py：

from django.shortcuts import render
from .models import Post

def index(request):
    # 同时查询全量文章和政治类文章
    all_posts = Post.objects.all()
    politics_posts = Post.objects.filter(category__contains='politics')
    return render(request, 'blog/index.html', {
        'posts': all_posts,
        'politics': politics_posts
    })

# 保留单独的列表页视图，对应页面单独渲染对应内容
def allposts(request):
    posts = Post.objects.all()
    return render(request, 'blog/allposts.html', {'posts': posts})

def political(request):
    politics = Post.objects.filter(category__contains='politics')
    return render(request, 'blog/political.html', {'politics': politics})

def post(request, pk):
    post = Post.objects.get(id=pk)
    return render(request, 'blog/posts.html', {'post': post})

2. 修复political.html的变量错误 #

原代码for循环将迭代项命名为politics，和传入的queryset重名，且内部错误引用了不存在的post变量，修改后代码：

{% extends 'index.html' %}
{% block content %}
    {% for post in politics %}
    <div class="row">
        <div class="post-entry-1 border-bottom">
        <a href="single-post.html"><img src="{{post.image.url}}" alt="" class="img-fluid"></a>
        <div class="post-meta"><span class="date">{{post.category}}</span> <span class="mx-1">&bullet;</span> <span>{{post.created_at}}</span></div>
        <h2 class="mb-2"><a href="single-post.html">{{post.title}}</a></h2>
        <span class="author mb-3 d-block">Ole Pundit</span>
        <p class="mb-4 d-block">{{post.body|truncatewords:75}}</p>
        </div>
    </div>
    {% endfor %}
{% endblock %}

3. 修复allposts.html的静态标签缺失问题 #

在模板extends语句后添加静态标签加载语句，修正后代码：

{% extends 'index.html' %}
{% load static %}
{% block allposts %}
{% for post in posts %}
  <div class="post-entry-1 col-lg-4 box mx-1">
    <a href="single-post.html"><img src="{{post.image.url}}" class="post_img"></a>
      <div>
        <div class="post-meta"><span class="date">{{post.category}}</span> <span class="mx-1">&bullet;</span> <span>{{post.created_at}}</span></div>
        <h2><a href="">{{post.title}}</a></h2>
      </div>
    <p class="mb-4 d-block">{{post.body|truncatewords:75}}</p>
    <div class="d-flex align-items-center author">
      <div class="photo"><img src="{% static 'assets/img/person-1.jpg' %}" alt="" class="img-fluid"></div>
      <div class="name">
        <h3 class="m-0 p-0">OlePundit</h3>
      </div>
    </div>
  </div>
{% endfor %}
{% endblock %}

4. 调整路由顺序 #

将固定路径路由移到动态参数路由之前，避免路由匹配错误，修改urls.py：

from django.urls import path
from . import views
from django.conf.urls.static import static
from django.conf import settings

urlpatterns= [
    path('', views.index, name='index'),
    # 固定路径放前面
    path('political', views.political, name='political'),
    path('allposts', views.allposts, name='allposts'),
    # 动态参数路由放后面
    path('<category>/<str:pk>', views.post, name='post'),
]

if settings.DEBUG:
     urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

5. （可选）基模板直接渲染内容 #

如果不需要单独的allposts、political列表页，直接在index.html的两个block内写循环渲染逻辑即可，不需要额外继承子模板，减少冗余代码。

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