首页 > 其他分享 >django模板之标签、继承、模型层之ORM常用关键字

django模板之标签、继承、模型层之ORM常用关键字

时间:2022-12-14 17:36:52浏览次数:53  
标签:return def html django ORM 模板 endblock block

目录

模板层之标签

	{% if 条件1(可以自己写也可以用传递过来的数据) %}
        <p>今天是周三了</p>
    {% elif 条件2(可以自己写也可以用传递过来的数据) %}
        <p>百日冲刺</p>
    {% else %}
        <p>没多少时间了!</p>
    {% endif %}

	{% for k in t1 %}  #t1是个空元组,会执行empty标签的数据
        {% if forloop.first %}
            <p>这是第一次循环{{ k }}</p>
        {% elif forloop.last %}
            <p>这是最后一次循环{{ k }}</p>
        {% else %}
            <p>这是中间循环{{ k }}</p>
        {% endif %}
        {% empty %}
            <p>你给我传的数据是空的无法循环取值(空字符串、空列表、空字典)</p>
    {% endfor %}

django模板语法取值操作:只支持句点符

django模板支持键也支持索引取值
d1 = {'name':'jason','age':18,'hobby':['read','music',{'a1':'haha','a2':'heihei'}]}
{{ d1.hobby.2.a1 }}  #前端页面取值到haha,通过句点符

冷门了解:
{% with d1.hobby.2.a1 as h %} 复杂数据获取之后需要反复使用可以起别名
	<a href="">{{ h }}</a>
{% endwith %}

代码验证:

urls.py:
from app01 import views
path('index/',views.index_func),

views.py:
def index_func(request):
    i = 666
    l1 = [11,22,33,44,55]
    d1 = {'name':'jason','age':18,'hobby':['read','music',{'a1':'haha','a2':'heihei'}]}
    s = False
    m = True
    t1 = ()
    return render(request,'indexPage.html',locals())

indexPage.html:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    {% if s %}
        <p>今天是周三了</p>
    {% elif m %}
        <p>百日冲刺</p>
    {% else %}
        <p>没多少时间了!</p>
    {% endif %}
    {% for k in t1 %}
        {% if forloop.first %}
            <p>这是第一次循环{{ k }}</p>
        {% elif forloop.last %}
            <p>这是最后一次循环{{ k }}</p>
        {% else %}
            <p>这是中间循环{{ k }}</p>
        {% endif %}
        {% empty %}
            <p>你给我传的数据是空的无法循环取值(空字符串、空列表、空字典)</p>

    {% endfor %}
    {{ d1.hobby.2.a1 }}
    <p>
        {% with d1.hobby.2.a1 as h %}
            <a href="">{{ h }}</a>
        {% endwith %}
    </p>
</body>
</html>

自定义过滤器、标签及inclusion_tag(了解)

"""
如果想要自定义一些模板语法 需要先完成下列的三步走战略
	1.在应用下创建一个名字必须叫templatetags的目录
	2.在上述目录下创建任意名称的py文件	
	3.在上述py文件内先编写两行固定的代码
		from django import template
		register = template.Library()
ps:报错需要重启django项目
"""
# 自定义过滤器(最大只能接收两个参数)
@register.filter(name='myadd')
def func1(a, b):
    return a + b
{% load mytags %}
<p>{{ i|myadd:1 }}</p>

# 自定义标签(参数没有限制)
@register.simple_tag(name='mytag')
def func2(a, b, c, d, e):
    return f'{a}-{b}-{c}-{d}-{e}'
{% load mytags %}
{% mytag 'jason' 'kevin' 'oscar' 'tony' 'lili' %}



# 自定义inclusion_tag(局部的html代码)
@register.inclusion_tag('menu.html',name='mymenu')
def func3(n):
    html = []
    for i in range(n):
        html.append('<li>第%s页</li>'%i)
    return locals()
{% load mytags %}
{% mymenu 20 %}

代码验证:

mytags.py:
from django import template
register = template.Library()

# 自定义过滤器(最大只能接收两个参数)
@register.filter(name='myadd')
def func1(a,b):
    return a + b

views.py:
def index_func(request):
    i = 666
    l1 = [11,22,33,44,55]
    d1 = {'name':'jason','age':18,'hobby':['read','music',{'a1':'haha','a2':'heihei'}]}
    s = False
    m = True
    t1 = ()
    return render(request,'indexPage.html',locals())

indexPage.html:
<p>{{ i|myadd:1 }}</p>

image

mytags.py:
# 自定义标签(参数没有限制)
@register.simple_tag(name='mytag')
def func2(a,b,c,d,e):
    return f'{a}-{b}-{c}-{d}-{e}'

indexPage.html:
{% mytag 'jason' 'kevin' 'oscar' 'jery' 'tony' %}

image

mytags.py:
#自定义inclusion_tag(局部的html代码)
@register.inclusion_tag('menu.html',name='mymenu')
def func3(n):
    html = []
    for i in range(n):
        html.append('<li>第%s页</li>'%i)
    return locals()

menu.html:
<ul>
    {% for liStr in html %}
        {{ liStr|safe }}
    {% endfor %}

</ul>

indexPage.html:
{% mymenu 10 %}

image

模板的继承与导入(重要)

多个页面有很多相似的地方 我们可以采取下列方式
方式1:传统的复制粘贴
方式2:模板的继承
	1.在模板中使用block划定子板以后可以修改的区域
		{% block 区域名称 %}
		{% endblock %}
	2.子板继承模板
		{% extends 'home.html' %}
		{% block 区域名称 %}
			子板自己的内容
		{% endblock %}
	ps:模板中至少应该有三个区域
		页面内容区、css样式区、js代码区
	补充:子板也可以继续使用模板的内容{{ block.super}}

代码验证:

urls.py:
# 模板的继承
path('home/',views.home_func),
path('login/',views.login_func),
path('register/',views.register_func),

views.py:
def home_func(request):
    return render(request,'home.html')

def login_func(request):
    return render(request,'loginPage.html')

def register_func(request):
    return render(request,'registerPage.html')


home.html:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    {% block css %}
    {% endblock %}
    {% load static %}
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.css' %}">
</head>
<body>
<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Separated link</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>
      <form class="navbar-form navbar-left">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Search">
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Separated link</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2">
           <div class="list-group">
              <a href="/home/" class="list-group-item active">
                首页资源
              </a>
              <a href="/login/" class="list-group-item">登录资源</a>
              <a href="/register/" class="list-group-item">注册资源</a>
              <a href="#" class="list-group-item">更多资源</a>
              <a href="#" class="list-group-item">其它资源</a>
            </div>
            <div class="list-group">
              <a href="#" class="list-group-item active">
                首页资源
              </a>
              <a href="#" class="list-group-item">登录资源</a>
              <a href="#" class="list-group-item">注册资源</a>
              <a href="#" class="list-group-item">更多资源</a>
              <a href="#" class="list-group-item">其它资源</a>
            </div>
            <div class="list-group">
              <a href="#" class="list-group-item active">
                首页资源
              </a>
              <a href="#" class="list-group-item">登录资源</a>
              <a href="#" class="list-group-item">注册资源</a>
              <a href="#" class="list-group-item">更多资源</a>
              <a href="#" class="list-group-item">其它资源</a>
            </div>
        </div>
        <div class="col-md-10">
            <div class="panel panel-primary">
              <div class="panel-heading">
                <h3 class="panel-title">Panel title</h3>
              </div>
              <div class="panel-body">
                  {% block content %}
                  <div class="page-header">
                  <h1>Example page header <small>Subtext for header</small></h1>
                </div>
                     <div class="jumbotron">
              <h1>Hello, world!</h1>
              <p>...</p>
              <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
            </div>
                  {% endblock %}

              </div>
            </div>

        </div>
    </div>
</div>
{% block js %}

{% endblock %}
</body>
</html>


loginPage.html:
{% extends 'home.html' %}

{% block css %}
    <style>
        #d1 {
            color:red;
        }
    </style>
{% endblock %}

{% block content %}
    <h1 class="text-center" id="d1">登录页面</h1>
    <form action="">
        <p>username
            <input type="text" class="form-control">
        </p>
        <p>password:
            <input type="text" class="form-control">
        </p>
        <input type="submit" class="btn btn-success">
    </form>
{% endblock %}

{% block js %}
    <script>alert('登录页面')</script>
{% endblock %}


registerPage.html:
{% extends 'home.html' %}

{% block css %}
    <style>
        #d2 {
            color: greenyellow;
        }
    </style>
{% endblock %}

{% block content %}
    <h1 class="text-center" id="d2">注册页面</h1>
    <form action="">
        <p>username
            <input type="text" class="form-control">
        </p>
        <p>password:
            <input type="text" class="form-control">
        </p>
        <input type="submit" class="btn btn-warning">
    </form>
{% endblock %}
{% block js %}
    <script>alert('注册页面')</script>
{% endblock %}

image
image
image

模板的导入(了解)
	将某个html的部分提前写好 之后很多html页面都想使用就可以导入
	{% include 'myform.html'%}
myform.html:
<h1 style="color: yellow">这是一个非常好看的form表单</h1>
registerPage.html:
{% include 'myform.html' %}

image

模型层之前期准备

ORM常用关键字(重要)

标签:return,def,html,django,ORM,模板,endblock,block
From: https://www.cnblogs.com/winter-yu1989/p/16982720.html

相关文章