Django中母版、组件、inclusion_tag的使用

母版页用于处理html页面相同部分内容，避免出现冗余代码

一、母版的使用：

• 使用母版情况1：母板中定义页面专用的CSS块和JS块，方便子页面替换。
• 使用母版情况2：多个页面有很多共同的代码段时可以将相同的代码段提取出来。
• 使用方法：
  通过在母板中使用 {% block xxx %}来定义"块"。
  在子页面中继承母版 {% extends "xxx.html" %}
  通过母板中的命名块{% block page-main%}....{% endblock %}来对应替换母板中相应的位置。

代码示例：
母版--->base.html

    
    
    



    

        

            个人数据管理中心
        
        

        
    

{% block page-main%}
{% endblock %}


{% block page-js %}
{% endblock %}

子内容-继承母版-->views.html

{% extends "base.html" %}
{% block page-main %}
    

        

            

                

                    

                        
数据详情
                        
                            添加数据
                        
                    
                    

                        
                                {% for head in heads_list %}
                                    
                                {% endfor %}
                            
                            {% for obj in obj_list %}
                                
                                    {% for field in obj %}
                                        
                                    {% endfor %}
                                
                            {% endfor %}
                            

                            

                            
{{ head }}
                            
                            

                                            {{ field }}
                                        
                        
                    
                
                {{ page_html|safe }}
                
                

                    

                        

                            

                                ×
                                
                                
确认删除
                            
                            
您确定要删除所选的数据吗？？？
                            

                                关闭
                                
                                    删除
                                
                            
                        

                    

                

                

            
        
    
{% endblock %}
{% block page-js %}
    
    
    
{% endblock %}

子内容-继承母版-->addviews.html

{% extends "base.html" %}
{% block page-main %}
    

        

            

                

                    

                        
添加数据
                    
                    

                        

                            {% csrf_token %}
                            {% for field in form_obj %}
                                

                                    {{ field.label }}
                                    {{ field }}
                                    {{ field.errors.0 }}
                                
                            {% endfor %}
                            
                        
                    
                
            
        
    
{% endblock %}

二、组件的使用：

可以将常用的页面内容如导航条，页尾信息等组件保存在单独的文件中，然后在需要使用的地方按如下语法导入即可。

{% include 'navbar.html' %}

组件和母版的区别：

• 组件相当于是单拿出来独立的一部分，哪里需要插哪里，即插即用！！！
• 母版相当于是一个整体的框架，将有差异的各个部分单留出空间来，以方便自定制内容的填充。

三、静态文件配置

简单地说就是：我们自己导入的一些包就叫做静态文件
配置的步骤：

• 1、在全局中先创建一个static的包，
• 2、在static里面导入我们的bootstrap，还是jquery等等...
• 3、然后在settings.py中加上一些配置

STATIC_URL = '/static/'   #这个相当于给配置起的别名,如果这里的名字修改了就按照这里的名字去导入
STATICFILES_DIRS = [
    os.path.join(BASE_DIR,"static")  #通过和项目根路径拼接得到static的路径
]

• 4.1、普通导入css,js,jquery

• 4.2 动态导入（这种导入更加灵活）

{% load static %}

• 还可以用在一下地方：

{% load static %}

{% load static %}

• 某个文件多处被用到可以存为一个变量:

{% load static %}
{% static "images/hi.jpg" as myphoto %}

• get_static_prefix的使用

{% load static %}

或者

{% load static %}
{% get_static_prefix as STATIC_PREFIX %}

四、inclusion_tag

类似于上面的组件，只不过他需要从后端得到数据才能完成渲染成功。多用于返回html代码片段
代码示例：

• 第一步：在app下创建一个名为templatetags（必须是这个名字）文件夹。
• 第二步：在这个文件夹下创建一个py文件，名字没要求。
• 第三步：在py文件中先导入，在注册，代码是固定死的。

from django import template
register = template.Library()

• 第四步：写视图函数得到页面所需要的数据，将数据return回来，
• 第五步：给这个视图函数加上@register.inclusion_tag(filename='left_menu.html'),以指定html文件将数据传入。
• 在需要用到自定义inclusion_tag的html文件中引入，引入固定规则为：
  通过使用{% load py文件名 %} {% 对应html文件名 py文件中的视图函数所需参数 %}的固定形式引用自定义的inclusion_tag。

l_menu.py文件示例：

from django import template
from blog import models
from datetime import datetime

register = template.Library()


@register.inclusion_tag(filename='left_menu.html')
def left_menu(username):
    # 通过用户信息找到当前用户的对象
    user_obj = models.UserInfo.objects.filter(username=username).first()
    # ORM操作查询当前用户对应的所有书籍
    article_list = models.Article.objects.filter(user=user_obj).order_by("create_time").reverse()
    # ORM操作查询当前用户对应的所有分类
    categorys = models.Category.objects.filter(blog=user_obj.blog)
    # ORM操作查询当前用户对应的blog的tags
    tags = models.Tag.objects.filter(blog=user_obj.blog)

    # 时间归档方式一
    #通过对所有对象的create_time字段的处理，通过列表的去重和计数得到对应的前端数据
    date_list = [datetime.strftime(obj.create_time, '%Y-%m') for obj in article_list]
    list2 = list(set(date_list))
    list2.sort(key=date_list.index)
    ret_date_list = [(i, date_list.count(i)) for i in list2]

    #时间归档方式二
    # 对当前blog的所有文章按照年月 分组 查询
    # 1. models.Article.objects.filter(user=user_obj)                   --> 查询出当前作者写的所有文章
    # 2. .extra(select={"y_m": "DATE_FORMAT(create_time, '%%Y-%%m')"}   --> 将所有文章的创建时间格式化成年-月的格式，方便后续分组
    # 3. .values("y_m").annotate(c=Count("id"))                         --> 用上一步时间格式化得到的y_m字段做分组，统计出每个分组对应的文章数
    # 4. .values("y_m", "c")                                            --> 把页面需要的日期归档和文章数字段取出来
    # archive_list = models.Article.objects.filter(user=user_obj).extra(
    #     select={"y_m": "DATE_FORMAT(create_time, '%%Y-%%m')"}
    # ).values("y_m").annotate(c=Count("id")).values("y_m", "c")

    return {
        'username': username,
        'categorys': categorys,
        'tags': tags,
        'ret_date_list': ret_date_list,
    }

left_menu.html示例：

    

        文章分类
    
    

        

            {% for category in categorys %}
                

                    
                        {{ category.title }}({{ category.article_set.all.count }})
                    
                
            {% endfor %}
        
    



    

        标签
    
    


        

            {% for tag in tags %}
                

                    
                        {{ tag }}({{ tag.article_set.all.count }})
                    
                
            {% endfor %}
        
    



    

        日期归档
    
    

        

            {% for date in ret_date_list %}
                

                    
                        {{ date.0 }}({{ date.1 }})
                    
                
            {% endfor %}
        
    

base.html文件示例：

    
    
    
    



    

        
        


      //通过使用{% load  py文件名 %}  {% 对应html文件名  py文件中的视图函数
      //所需参数 %}的固定形式引用自定义的inclusion_tag。
            {% load l_menu %}
            {% left_menu username %}
        
        
        {% block page-main %}
        {% endblock page-main %}
    



{% block page-js %}
{% endblock page-js %}