Django 之模板继承及函数应用_django模板继承能否使用当前页面参数

作者：繁依Fanyi0 | 2024-06-29 12:34:06

踩

django模板继承能否使用当前页面参数

模板继承

一个网站由很多html页面组成，通常大部分html页面都有公共的布局如导航栏，侧边栏，页面底部等。这些公共部分可以单独抽离出来的模板称为母版，给所有的html页面继承，继承母版的模板称为子板，这样使页面容易修改且更加简洁。

一个html页面只能继承一个母版，通常母版的内容比子板的内容要多。

1、在母版中定义block块, xxx为自定义的block名称

{% block xxx %} {% endblock %}

2、在子板中继承母版，对应block名称要一致

{% extends 'parent.html' %} # 表示继承哪个母版

{% block xxx %} {% endblock %}

示例：

=== layout.html ===

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %} {% endblock %}</title>
    <link rel="stylesheet" href="/static/commons.css" />
    {% block css %} {% endblock %}
</head>
<body>
    <div class="pg-header">xxx</div>
    {% block content %} {% endblock %}
    <div class="pg-footer"></div>
    <script type="/static/jquery.js"></script>
    {% block js %} {% endblock %}
</body>
</html>

=== tpl1.html ===

{% extends 'layout.html' %}
{% block title %}用户管理{% endblock %}
{% block content %}
    <h1>用户管理</h1>
    <ul>
        {% for i in u %}
            <li>{{ i }}</li>
        {% endfor %}
    </ul>
{% endblock %}

{% block css %}
    <style>
        body{background-color: red;}
    </style>
{% endblock %}

{% block js %}
    <script></script>
{% endblock %}

# urls.py
urlpatterns = [
    url(r'^tpl1/', views.tpl1),
]

# views.py
from django.shortcuts import render, HttpResponse,redirect
def tpl1(request):
    user_list = [1, 2, 3, 4]
    return render(request, 'tpl1.html', {'u': user_list})

网站的公共部分我们可以使用继承，有时网站的某个小区域html结构和样式相同内容不一样，此时同样可以把这部分剥离出来，但用继承不合适，因为每个html页面这部分的内容不一样，可以通过 {% include 'xxx.html' %} 包含进来，并进行模板语言进行渲染。

=== sub-unit.html ===

<div class="list" id="n1">
    <ul>
        <li class="">
            <a href="http://" target="_blank">
                <img src="http://img.jpg">
                <span class="shop_name">xxx</span>
                <span class="time">
                  <span >
                    <span sec="sep">
                        <span>4</span>
                    </span>
                   </span>
                </span>
                <span class="left_shadow">
                    <span class="img_logo">
                        <img data-original="http://img.jpg" src="http://" tyle="display: block;">
                    </span>
                    <span class="shop_ad">xxx</span>
                    <span class="price_z"><span></span> 
                    </span>
                    <span class="sale"></span>
                </span>
                <span class="red_circle" style="display: none;"></span>
            </a>
        </li>
    </ul>
</div>

=== tmp2.html ===

{% extends 'layout.html' %}
{% block title %}主机管理{% endblock %}
{% block content %}
    <h1>主机管理</h1>
    {% for i in u %}
        {% include 'sub-unit.html' %}
    {% endfor %}
{% endblock %}

{% block css %}
    <style>
        body{
            background-color: red;
        }
    </style>
{% endblock %}

{% block js %}
    <script></script>
{% endblock %}

# urls.py
urlpatterns = [
    url(r'^tpl2/', views.tpl2),
]

# views.py
from django.shortcuts import render, HttpResponse,redirect
def tpl2(request):
    name = 'root'
    return render(request, 'tpl2.html', {'name': name})

在模板中应用函数

Python中有很多内置函数如 lower, upper, truncatechars, date 等等，Django在对html进行渲染时除了可以将变量放在模板语言中，还可以将变量通过管道符“|”传递给函数

示例：

# urls.py
urlpatterns = [
    url(r'^tpl3/', views.tpl1),
]

# views.py
from django.shortcuts import render, HttpResponse,redirect
def tpl3(request):
    name = 'root'
    return render(request, 'tpl3.html', {'name': name})

=== tpl3.html ===

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    {{ name }}
    {{ name|lower }}
    {{ name|first|upper }}
    {{ name|truncatechars:"3" }}
</body>
</html>

一、自定义filter

很多时候Python内置函数不能满足需求，此时需要自定义函数并调用。在模板语言中调用自定义的函数称为自定义filter，步骤如下：

1、app下创建templatetags目录

proj/
├── proj/
├── app01/
│ ├── migrations/
│ ├── templatetags/
│ ├── __init__.py
│ ├── admin.py
│ ├── apps.py
│ ├── models.py
│ ├── tests.py
│ └── view.py
└── manage.py

2、在templatetags目录下创建任意名称的py文件 (在settings中配置当前app)

=== ft.py ===

from django import template
from django.utils.safestring import mark_safe

register = template.Library()  # 创建template对象 register 

@register.filter # 自定义函数前加上filter装饰器
def ft1(a1,a2):
    return a1 + a2

@register.filter # 自定义函数前加上filter装饰器
def ft2(a1,a2):
    return a1 + str(a2)

3、在html顶部中导入以上py文件 {% load ft %}

=== tpl4.html ===

{% load ft %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    {{ "root"|ft1:"def" }}   
    {{ "root"|ft2:123 }}
</body>
</html>

# 可以进行条件判断 {{ if "arg1"|func:"arg2" }}，注意filter函数最多接收两个参数且不能有空格，若要加多个参数通过{{ "arg1"|func:"arg2，arg3" }} 将"arg2,arg3"作为整体，在自定义函数中以","分隔符进行处理。

二、自定义simple_tag

除了通过管道传递参数给函数外，还可以用自定义simple_tag的方式，步骤如下：

1、app下创建templatetags目录 ( 同自定义filter一样 )

2、在templatetags目录下创建任意名称的py文件 (在settings中配置当前app)

=== spt.py ===

from django import template
from django.utils.safestring import mark_safe

register = template.Library() # 创建template对象 register

@register.simple_tag  # 自定义函数前加上 simple_tag 装饰器

def sp(a1,a2,a3): 
　　return a1 + a2 + a3

=== tpl5.html ===

{% load spt %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    {% spt1  2  3  6 %}
    {% spt1  "root"  "a"  "b" %}
</body>
</html>

# 自定义simple_tag 函数可以接收任意个参数 {{ spt1 "arg1" "arg2" "arg3" }} ,但不能作为if 判断条件

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/769259

Django 之 模板继承 及 函数应用_django模板继承能否使用当前页面参数

模板继承

在模板中应用函数

Django 之模板继承及函数应用_django模板继承能否使用当前页面参数