day58

模板相关

模板继承(母版继承)

1. 创建一个xx.html页面(作为母版,其他页面来继承它使用)

2. 在母版中定义block块(可以定义多个,整个页面任意位置)

	{% block content %}  <!-- 预留的钩子,共其他需要继承它的html,自定义自己的内容 -->

	内容。。。

	{% endblock %}

3 其他页面继承写法

	{% extends 'base.html' %}  必须放在页面开头

4 页面中写和母版中名字相同的block块,从而来显示自定义的内容

    {% block content %}  <!-- 预留的钩子,共其他需要继承它的html,自定义自己的内容 -->

        {{ block.super }}  #这是显示继承的母版中的content这个快中的内容

        这是xx1

    {% endblock %}

事例：

模板页面

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        li{

            float: left;

            background: red;

        }

    </style>

</head>

<body>

<ul type="none">

    <li>第一</li>

    <li>第二</li>

    <li>第三</li>

    <li>第四</li>

</ul>

<br>

<h1>第一</h1>

{% block content %}

    这是模板

{% endblock %}

</body>

</html>

模板页面效果：

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

继承页面

{% extends "base.html" %}

{% block content %}

    <h1>我是大帅哥</h1>

    {% for i in "123" %}

        <h4>{{ i }}</h4>

    {% endfor %}

    {{ block.super }}

{% endblock %}

继承页面效果：

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

组件

1 创建html页面,里面写上自己封装的组件内容,xx.html

2 新的html页面使用这个组件

	{% include 'xx.html' %}

组件事例

组件页面：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<h1>我是导航栏</h1>

</body>

</html>

应用页面：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

{% include 'zujian.html' %}

<h1>我是应用组件的</h1>

</body>

</html>

组件与插件的区别

组件是提供某一个完整功能的模块：如：编辑器组件，QQ空间提供的关注组件等

而插件更倾向封闭某一功能方法的函数

这两者的区别在 Javascript 里区别很笑，组件这个名词用的不多，一般统称为插件

自定义标签和过滤器

1 在应用下创建一个叫做templatetags的文件夹(名称不能改),在里面创建一个py文件,例如xx.py

2 在xx.py文件中引用django提供的template类,写法

	from django import template

	register = template.Library() #register变量名称不能改

	定义过滤器

		@register.filter   参数至多两个

		def xx(v1,v2):

			return xxx

	使用:

		{% load xx %}

		{% name|xx:'oo' %}

	# 自定义标签 没有参数个数限制

    @register.simple_tag

    def huxtag(n1,n2):  #冯强xx  '牛欢喜'

        '''

        :param n1:  变量的值 管道前面的

        :param n2:  传的参数 管道后面的,如果不需要传参,就不要添加这个参数

        :return:

        '''

        return n1+n2

    使用：

    	{% load xx %}

    	{% huxtag 12 23 %}

实例

定义标签和过滤器的py文件

from django import template

from django.utils.safestring import mark_safe

register = template.Library()

@register.filter

def num(v1, v2):

    return v1 * v2

@register.simple_tag

def num2(v1, v2):

    return v1 *v2

@register.simple_tag

def num3(v1, v2, v3):

    return v1+v2+v3

应用文件

{% load filter_tag %}

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<h1>自定义过滤器：{{ a|num:b }}</h1>

<h1>自定义标签：{% num2 12 3 %}</h1>

<h1>自定义标签多个参数：{% num3 12 12 12 %}</h1>

</body>

</html>

inclusion_tag

# inclusion_tag 返回html片段的标签

@register.inclusion_tag('result.html')

def res(n1): #n1 : ['aa','bb','cc']

    return {'li':n1 }

使用:

	{% res a %}

实例

配置函数的py文件——inclusion_tagg

from django import template

register = template.Library()

@register.inclusion_tag('tagg_2.html')  # 将tagg_2.html里面的内容用下面函数的返回值渲染，然后作为一个组件加载到应用文件里面

def show(n):  # n是应用文件中传入的列表，参数可以传多个进来

    data = n

    return {'data': data}  # 把列表传入动态html文件，注意变量名需一样，这里可以穿多个值，和render的感觉是一样的{'data1':data1,'data2':data2....}

动态html文件——tagg_2

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<ul>

    {% for i in data %}  # py文件传入的文件

        <li>{{ i }}</li>

    {% endfor %}

</ul>

</body>

</html>

应用文件——tagg_1

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

{% load inclusion_tagg %}

{% show lst %}  # lst是views中传入的列表，变量名需一样

</body>

</html>

静态文件配置

setting文件配置

1 项目目录下创建一个文件夹,例如名为jingtaiwenjianjia（文件夹名随便取）,将所有静态文件放到这个文件夹中

2 settings配置文件中进行下面的配置

	# 静态文件相关配置

    STATIC_URL = '/abc/'  #静态文件路径别名

    STATICFILES_DIRS = [

        os.path.join(BASE_DIR, 'jingtaiwenjianjia'),

    ]

3 引入<link rel="stylesheet" href="/abc/css/index.css">

应用app01创建配置

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

文件引入配置

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" href="/static/css/index.css">

    <link rel="stylesheet" href="/static/bootstrap\bootstrap-3.3.7-dist\css\bootstrap.min.css">

</head>

<body>

<h1>来了！老弟！</h1>

<img src="/static/img/1.jpg" alt="">

<span class="glyphicon glyphicon-plus"></span>

<script src="/static/jquery/jquery.js"></script>

<script src="/static/js/index.js"></script>

</body>

</html>

url别名和反向解析

写法

	url(r'^index2/', views.index,name='index'),

反向解析

	后端: from django.urls import reverse

		 reverse('别名')  例如:reverse('index') -- /index2/

		 带参数的反向解析:reverse('index',args=(10,11,))	-- /index2/10/

	html: {% url '别名' %} -- 例如:{% url 'index' %} -- /index2/

	带参数的反向解析:{% url '别名' 参数1 参数2 %} 例如:{% url 'index' 10 %} -- /index2/10/  <a href='/index2/10/'>hhh</a>

实例

urls文件

from django.conf.urls import url

from django.contrib import admin

from app01 import views

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(r'^login/', views.login),

    url(r'^home2/', views.home, name='home'),

    url(r'^flase2/', views.flase, name='flase'),

]

views文件

from django.shortcuts import render,HttpResponse,redirect

from django.urls import reverse

def login(request):

    if request.method == 'GET':

        return render(request, 'login.html')

    else:

        name = request.POST.get('username')

        pwd = request.POST.get('pwd')

        if name == 'zdr' and pwd == '123':

            return redirect('home')

            # return render(request, 'home.html')

        else:

            return redirect('flase')

def home(request):

    return render(request, 'home.html')

def true(request):

    return render(request, 'true.html')

def flase(request):

    return render(request, 'flase.html')

url命名空间

路由分发 include

1.	创建app：python3 manage.py startapp app02

在setting文件中修改数据

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

在每个app下创建urls.py文件,写上自己app的路径

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

在三个urls文件添加数据

事例

总urls

from django.conf.urls import url,include

from django.contrib import admin

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^app01/', include('app01.urls')),

    url(f'^app02/', include('app02.urls')),

]

app01的urls

from django.conf.urls import url,include

from django.contrib import admin

from app01 import views

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^home', views.home, name='home'),

]

app02的urls

from django.conf.urls import url,include

from django.contrib import admin

from app02 import views

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^home', views.home, name='home'),

]

命名空间namespace

urls别名获取值

urls中的别名是获取的路径是urls文件中取别名前面的正则表达式的内容

如果没有分发：url(r'^index2/', views.index,name='index')——>/index2/

如果是路由分发：url(r'^index2/', views.index,name='index')——>/应用名/index2/（/app01/index2/）

事例：

总urls

from django.conf.urls import url,include

from django.contrib import admin

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^app01/', include('app01.urls', namespace='app01')),

    url(f'^app02/', include('app02.urls', namespace='app02')),

]

app01的urls

from django.conf.urls import url,include

from django.contrib import admin

from app01 import views

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^home', views.home, name='home'),

    url(f'^index', views.index, name='index'),

]

app02的urls

from django.conf.urls import url,include

from django.contrib import admin

from app02 import views

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(f'^home', views.home, name='home'),

]

app01的views

from django.shortcuts import render,HttpResponse,redirect

from django.urls import reverse

def home(request):

    # return HttpResponse('我是首页1')

    return render(request, 'home.html')

def index(request):

    return redirect(reverse('app01:home'))

app02的views

from django.shortcuts import render,HttpResponse

def home(request):

    return HttpResponse('我是首页2')

html文件——home.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<h1>我是首页</h1>

<a href="{% url 'app02:home' %}">aaaa</a>

</body>

</html>

总结

后端的时候serverse('app01:home')，括号里面必须是命名空间名称:别名

hmtl:{% url '命名空间名称:别名' %}，{% %}里面必须是命名空间名称:别名

from django.conf.urls import url,include

from django.contrib import admin

urlpatterns = [

    # url(r'^admin/', admin.site.urls),

    url(r'^app01/', include('app01.urls',namespace='app01')),#app01/home/

    url(r'^app02/', include('app02.urls',namespace='app02')),

]

使用:

	后端:reverse('命名空间名称:别名') -- reverse('app01:home')

	hmtl:{% url '命名空间名称:别名' %}  -- {% url 'app01:home' %}

秒客网

day58——模板继承、组件、自定义标签和过滤器、inclusion_tag、静态文件配置、url别名和反向解析、url命名空间

day58

模板相关

模板继承(母版继承)

模板页面

继承页面

组件

组件事例

组件与插件的区别

自定义标签和过滤器

实例

inclusion_tag

实例

静态文件配置

setting文件配置

应用app01创建配置

文件引入配置

url别名和反向解析

实例

url命名空间

路由分发 include

事例

命名空间namespace

urls别名获取值

事例：

总结

相关文章