zoukankan      html  css  js  c++  java
  • Dango之模版系统

    1.模板渲染

    可以传列表,字典,对象等

    {{ 变量 }}   {% 逻辑 %} -- 标签
    

    urls.py

    path('login/', views.login),
    

    views.py

    def login(request):
        name = 'zbb'
        return render(request,'login.html',{"name":name})
    

    html

    {{ name }}
    

    2.万能的点

    <h4>列表:{{ l.2 }}</h4>
    <h4>字典:{{ dic.name }}</h4>
    <h2>字典:{{ d1.items }}</h2> #循环取值
    <h4>日期:{{ date.year }}</h4>
    <h4>对象:{{ obj.p }}</h4>
     #如果调用的方法需要传参,sorry用不了
    

    3.过滤器(内置)

    在Django的模板语言中,通过使用 过滤器 来改变变量的显示。

    过滤器的语法

    {{ value|filter_name:参数 }}
    

    使用管道符"|"来应用过滤器。

    注意事项:

    1. 过滤器支持“链式”操作。即一个过滤器的输出作为另一个过滤器的输入。
    2. 过滤器可以接受参数,例如:{{ sss|truncatewords:30 }},这将显示sss的前30个词。
    3. 过滤器参数包含空格的话,必须用引号包裹起来。比如使用逗号和空格去连接一个列表中的元素,如:{{ list|join:', ' }}
    4. '|'左右没有空格

    1.default

    如果一个变量是false或者为空,使用给定的默认值。 否则,使用变量的值。

    {{ value|default:"nothing"}}
    

    2.length

    返回值的长度,作用于字符串和列表。

    {{ value|length }}
    value=['a', 'b', 'c', 'd']的话,就显示4.
    

    3.fIlesizeformat

    将值格式化为一个 “人类可读的” 文件尺寸 (例如 '13 KB', '4.1 MB', '102 bytes', 等等)

    {{ num|filesizeformat }}
    

    4.slice

    切片,如果 value="hello world",还有其他可切片的数据类型

    {{value|slice:"2:-1"}}
    

    5.date

    格式化,如果 value=datetime.datetime.now()

    {{ value|date:"Y-m-d H:i:s"}}
    

    6.safe

    Django的模板中在进行模板渲染的时候会对HTML标签和JS等语法标签进行自动转义,原因显而易见,这样是为了安全,django担心这是用户添加的数据,比如如果有人给你评论的时候写了一段js代码,这个评论一提交,js代码就执行啦,这样你是不是可以搞一些坏事儿了,写个弹窗的死循环,那浏览器还能用吗,是不是会一直弹窗啊,这叫做xss攻击,所以浏览器不让你这么搞,给你转义了。但是有的时候我们可能不希望这些HTML元素被转义,比如我们做一个内容管理系统,后台添加的文章中是经过修饰的,这些修饰可能是通过一个类似于FCKeditor编辑加注了HTML修饰符的文本,如果自动转义的话显示的就是保护HTML标签的源文件。为了在Django中关闭HTML的自动转义有两种方式,如果是一个单独的变量我们可以通过过滤器“|safe”的方式告诉Django这段代码是安全的不必转义。

    value = "<a href='#'>点我</a>" 和 value="<script>alert('123')"

    {{ value|safe}}
    

    7.truncatechars

    如果字符串字符多于指定的字符数量,那么会被截断。截断的字符串将以可翻译的省略号序列(“...”)结尾。

    参数:截断的字符数

    注意 django 11版本 ... 是占三个字符

    2版本只占一个

    {{ value|truncatechars:6}} 
    #注意:最后那三个省略号也是6个字符里面的,
    #也就是这个9截断出来的是5个字符+3个省略号(占一个字符),
    #怎么展开啊,配合前端的点击事件就行啦
    

    8.truncatewords

    在一定数量的字后截断字符串,是截多少个单词。

    例如:‘hello girl hi baby yue ma’,

    {{ value|truncatewords:3}}  #上面例子得到的结果是 'hello girl h1...'
    

    9.cut

    移除value中所有的与给出的变量相同的字符串

    {{ value|cut:' ' }}
    

    10.join

    使用字符串连接列表,,就像Python的str.join(list)

    {{ list|join:', ' }}
    

    4.标签

    1.for循环标签

    遍历每一个元素: 写个for,然后 tab键自动生成for循环的结构,循环很基础,就这么简单的用,没有什么break之类的,复杂一些的功能,你要通过js

    循环列表

    {% for person in person_list %}
        <p>{{ person.name }}</p>  <!--凡是变量都要用两个大括号括起来-->
    {% endfor %}
    

    可以利用{% for obj in list reversed %}反向完成循环。

    循环字典

    {% for key,val in dic.items %}
        <p>{{ key }}:{{ val }}</p>
    {% endfor %}
    
    注:循环序号可以通过{{forloop}}显示,必须在循环内部用  
    
    forloop.counter            当前循环的索引值(从1开始),forloop是循环器,通过点来使用功能
    forloop.counter0           当前循环的索引值(从0开始)
    forloop.revcounter         当前循环的倒序索引值(从1开始)
    forloop.revcounter0        当前循环的倒序索引值(从0开始)
    forloop.first              当前循环是不是第一次循环(布尔值)
    forloop.last               当前循环是不是最后一次循环(布尔值)
    forloop.parentloop         本层循环的外层循环的对象,再通过上面的几个属性来显示外层循环的计数等
    

    2.for ... empty

    for 标签带有一个可选的{% empty %} 从句,以便在给出的组是空的或者没有被找到时,可以有所操作。

    {% for person in person_list %}
        <p>{{ person.name }}</p>  
    {% empty %}
    	<p>没有找到东西!</p>
    {% endfor %}
    

    3.if判断标签

    {% if num > 100 or num < 0 %}
        <p>无效</p>  <!--不满足条件,不会生成这个标签-->
    {% elif num > 80 and num < 100 %}
        <p>优秀</p>
    {% else %}  <!--也是在if标签结构里面的-->
        <p>凑活吧</p>
    {% endif %}
    
    if语句支持 and 、or、==、>、<、!=、<=、>=、in、not in、is、is not判断,注意条件两边都有空格。
    

    当然也可以只有if和else

    if语句支持 and 、or、==、>、<、!=、<=、>=、in、not in、is、is not判断,注意条件两边都有空格。

    {% if user_list|length > 5 %}  <!--结合过滤器来使用-->
      七座豪华SUV
    {% else %}
        黄包车
    {% endif %}
    

    4.with

    用于给一个复杂的变量起别名

    {% with business.employees.count as total %}
        {{ total }}
    {% endwith %}
    
    

    5.模板继承

     Django模版引擎中最强大也是最复杂的部分就是模版继承了。模版继承可以让您创建一个基本的“骨架”模版,它包含您站点中的全部元素,并且可以定义能够被子模版覆盖的 block

    简单理解 html css js 都能继承

    html模版中定义

    {% block content %} <!--预留标签用于引用 -->
    这是模版
    {% endblock %}
    

    子html

    {% block content %}
        这是首页
    {% endblock %}
    

    举例

    urls

    path('index/', views.index),
    path('menu1/', views.menu1),
    path('menu2/', views.menu2),
    

    views

    def index(request):
         return render(request,'index.html')
    
    def menu1(request):
        return render(request,"menu1.html")
    
    def menu2(request):
        return render(request,"menu2.html")
    

    base.html 模版

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            h1{
                background-color: oldlace;
                height: 40px;
            }
            .menu{
                background-color: grey;
                height: 40px;
                 200px;
                float: left;
            }
        </style>
        {% block css %}
    
        {% endblock %}
    </head>
    <body>
    
    <a href="/index/">回到首页</a>
    
    <h1>追梦NAN</h1>
    <div class="menu">
        <div class="c1">
            <a href="/menu1/">菜单1</a>
        </div>
        <div class="c2">
            <a href="/menu2/">菜单2</a>
        </div>
    
    </div>
    <div class="content">
    
        {% block content %} <!--预留标签用于引用 -->
            这是模版
        {% endblock %}
    </div>
    
    </body>
    
    </html>
    

    index.html

    {% extends 'base.html' %}
    
    {% block css %}
        <style>
        h1{
            background-color: red;
        }
        </style>
    {% endblock %}
    {% block content %}
        这是首页
    {% endblock %}
    

    menu1.html

    {% extends 'base.html' %}
    
    {% block content %}
        {{ block.super }} <!-- 可以继承模版原来的内容-->
        这是菜单1
    {% endblock %}
    

    6.组件

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

    1 创建html页面,里面写上自己封装的组件内容,xx.html
    2 新的html页面使用这个组件
    {% include 'xx.html' %}
    

    举例:

    urls

    path('xx/', views.xx),
    

    views

    def xx(request):
        return render(request,"xx.html")
    

    title.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .nav{
                background-color: pink;
                height: 40px;
            }
        </style>
    </head>
    <body>
    <div class="nav">
        <span>个人中心</span>
        <span>首页</span>
        <span>登录</span>
        <span>个注册</span>
    </div>
    
    </body>
    
    </html>
    

    xx.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    {% include 'title.html' %}
    <h1>这是首页</h1>
    </body>
    
    </html>
    

    组件和插件的简单区别

    组件是提供某一完整功能的模块,如:编辑器组件,QQ空间提供的关注组件 等。
    
    而插件更倾向封闭某一功能方法的函数。
    
    这两者的区别在 Javascript 里区别很小,组件这个名词用得不多,一般统称插件。
    

    7.自定义标签和过滤器

    第一步

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

    第二步

    在xx.py文件中引用django提供的template类,写法
    	from django import template
    	register = template.Library() #register变量名称不能改
    

    1.过滤器

    第一步

    在xx.py中定义过滤器

    @register.filter
    def addoo(n1):
        '''
        :param n1:变量的值 管道前面的
        :param n2:传的参数,管道后面的,如果不需要传参,不写这个参数
        :return: 参数最多两个
        '''
        return n1+"oo"
    

    第二步

    创建test.html 引用过滤器

    {% load xx %}
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    {{ name|addoo }}
    </body>
    
    </html>
    

    第三步:

    加入urls views

    path('test/', views.test),
    
    def test(request):
        return  render(request,"test.html",{"name":"zbb"})
    

    2.标签

    第一步

    xx.py定义标签

    @register.simple_tag()
    def xx_tag(n1,n2):
        '''
        :param n1:变量的值 管道前面的
        :param n2:传的参数,管道后面的,如果不需要传参,不写这个参数
        :return: 参数无限制
        '''
        return n1+n2
    

    第二步 test.html

    {% load xx %}
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
    {% xx_tag name " zhuimengnan.com" %}
    
    </body>
    
    </html>
    

    第三步

    urls,views中同上

    3.inclusion_tag

    返回html片段的标签

    第一步:xx.py

    @register.inclusion_tag('result.html')
    def res(n1):
        return {'z':n1}
    

    第二步result.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
    <ul>
        {% for foo in z %}
            <li>{{ foo }}</li>
        {% endfor %}
    
    </ul>
    </body>
    
    </html>
    

    第三步: new.html

    {% load xx %}
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    {% res a  %}
    </body>
    
    </html>
    

    第四步: urls,views

    path('new/', views.new),
    
    def new(request):
        a=['aa','bb','ccc']
        return render(request,'new.html',{"a":a})
    

    8.静态文件配置

    第一步:

    项目目录下创建一个文件夹,命名随意 例如:statics

    将所有静态文件放到这个文件夹中 可继续创建子目录用来区分

    例如创建子目录css

    第二步:

    settings配置文件中最后添加以下配置

    STATIC_URL = '/static/' #静态文件别名
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR, 'statics'),
        ]
    

    第三步:you.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>是我错了</title>
        <link rel="stylesheet" href="/static/css/you.css">
    </head>
    <body>
    <h1>你还好么?我懦弱的逃离</h1>
    <ul>
        <li>小猪</li>
        <li>晓迎</li>
        <li>迎子</li>
    </ul>
    
    </body>
    
    </html>
    

    第四步 urls,views

    path('you/', views.you),
    
    def you(request):
        return  render(request,'you.html')
    

    9.url别名和反向解析

    url别名

    path('you/', views.you,name="iyou"),
    

    别名反向解析

    from django.urls import reverse
    例如:
    reverse('index')  打印 /index2/
    reverse('index',args=(1,2))   --/index/1/2/
    reverse('index',kwargs={'name':'xx',"age":'18'})    /index/xx/18
    
    html: {% url '别名' %} 
    例如:
    {% url 'index' 2 3%} -- /index/2/3
    

    10.url路由分发

    include
    第一步

    先用pycharm 创建一个项目里面有一个app01应用
    然后在pycharm 项目中,继续创建app02应用
    在settings中加入app02
    

    第二步:

    在每个app下创建urls.py文件,写上自己app的路径
    在项目目录下的urls.py文件中做一下路径分发,看下面内容
    

    第三步:

    应用中的urls

    from django.contrib import admin
    from django.urls import path
    from django.conf.urls import inclue
    
    from   app01 import  views 
    urlpatterns = [
        path('app01/',,include('app01.urls')),
        path('app02/',,include('app02.urls')),
    ]
    

    项目中的urls

    from   app01 import  views #2就是app02
    urlpatterns = [
        path('home/',views.home),
    ]
    

    项目中的view

    from django.shortcuts import render,HttpResponse
    
    # Create your views here.
    
    def home(request):
        return  HttpResponse("app01")
    

    11.命名空间namespace

    即使不同的APP使用相同的URL名称,URL的命名空间模式也可以让你唯一反转命名的URL。

    不通app下的别名重复 ,也会覆盖

    from django.urls import path,include
    
    urlpatterns = [
        #当前app02下的所有别名都属于app02
        path('app02/',include('app02.urls',namespace='app02')),
    ]
    

    使用:

    后端:reverse('命名空间名称:别名') -- reverse('app01:home') 
    hmtl:{% url '命名空间名称:别名' %}  -- {% url 'app01:home' %}
    
  • 相关阅读:
    VC++60运行出结果后直接关闭窗口了
    求助MFC编程实现可视化
    多个do循环优化问题
    召唤大神这道题怎么就乱码了呢~~~
    HBASE 优化之REGIONSERVER
    HBASE SHELL 命令使用
    HBASE 基础命令总结
    HBASE基础知识总结
    2018年年终总结
    IMPALA部署和架构(一)
  • 原文地址:https://www.cnblogs.com/zdqc/p/11638144.html
Copyright © 2011-2022 走看看