Django学习路线之Django自带模板语言DTL

在前两篇文章中,视图函数只是直接返回文本,而在实际生产环境中其实很少这样用,因为实际的页面大多是带有样式的HTML代码,这可以让浏览器渲染出非常漂亮的页面

Django中,可以把模板理解成一种便捷地动态生成HTML的方法,下面我们一起来学习一下:

  1. 模板初体验
  2. 模板变量
  3. 模板标签
  4. 模板过滤器
  5. 模板结构优化
  6. 加载静态文件
    在这里插入图片描述

1. 模板初体验

回忆一下第一篇文章里讲到的MVT思想:
Django学习路线之从虚拟环境开始Django初体验

这个T指的就是模板,模板的作用是返回一个HTML界面,再由视图返回给浏览器

DTL与普通的HTML文件的区别

DTL是Django Template Language三个单词的缩写,也就是Django自带的模板语言

DTL模板是一种带有特殊语法的HTML文件,这个HTML文件可以被Django编译,可以传递参数进去,实现数据动态化

在编译完成后,生成一个普通的HTML文件,然后发送给客户端

创建项目,配置环境

在开始之前,我们先进入虚拟环境,并新建一个名为django_template_demo的项目:
在这里插入图片描述
再建一个名为book的app:
在这里插入图片描述
在urls.py里导入include,并在urlpatterns里添加映射 :
在这里插入图片描述
在book里新建urls.py并添加代码:

from django.urls import path
from . import views

urlpatterns = [
    path("", views.index)
]

然后在book的views.py里添加页面:

from django.shortcuts import render
from django.http import HttpResponse

# Create your views here.
def index(request):
    return HttpResponse("图书首页")

添加runserver后,运行manage.py:
在这里插入图片描述
开启服务:
在这里插入图片描述
效果如下:
在这里插入图片描述
到这里,就算是对上一篇文章的复习,下面我们来看一下怎么让HttpResponse返回一个前端页面

首先在项目下新建一个名为templates的文件夹,在该文件夹下存放我们的静态页面:
在这里插入图片描述
简单写一个前端页面:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

用户名:<input name="username" type="text">

</body>
</html>

接下来怎么让前端页面显示呢?下面就是渲染模板的内容

渲染模板

渲染模板有多种方式,下面是两种常用的方式

render_to_string

在book下的views.py里导入库:

from django.template.loader import render_to_string

并让HttpResponse返回前端页面:

def index(request):
    html = render_to_string("index.html")

    return HttpResponse(html)

下面我们先尝试运行一下:
在这里插入图片描述
这时发现报错了,看一下报错信息,应该是配置出现了问题,下面我们到settings.py里:
在这里插入图片描述
找到TEMPLATES里的DIRS,可以看到这块是空的,下面我们补充一下:

'DIRS': [os.path.join(BASE_DIR,'templates')]

刷新页面:
在这里插入图片描述
这句话有什么用呢?我们来打印一下:
在这里插入图片描述
输出的路径是存放前端代码的文件夹的路径,也就是说,添加上这段代码后,将会从提供的路径下找到对应的前端页面

而BASE_DIR是当前项目的地址

该方式是将模板编译后渲染成Python的字符串格式,最后再通HttpResponse类包装成一个HttpResponse对象返回回去

当然,这个方法还不是最简单的,下面看一下render方法:

render

这个render模块在新建app时是自动导入的:
在这里插入图片描述
来看一下它的源码:
在这里插入图片描述
可以看到,它返回的其实还是HttpResponse,第一个参数是request,第二个参数是模板:

from django.shortcuts import render

# Create your views here.
def index(request):
    # html = render_to_string("index.html")

    return render(request,"index.html")

效果如下:
在这里插入图片描述
render直接将模板渲染成字符串和包装成HttpResponse对象一步到位完成

模板查找路径配置

在项目的settings.py文件中,有一个TEMPLATES配置,这个配置包含了模板引擎的配置,模板查找路径的配置,模板上下文的配置等

模板路径配置
1.DIRS

这是一个列表,在这个列表中可以存放所有的模板路径,以后在视图中使用render或者render_to_string渲染模板的时候,会在这个列表的路径中查找模板

下面我们试一试在项目外创建静态文件存放的文件夹:
在这里插入图片描述
下面补充一下HTML代码:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>该静态页面的路径为D:\Envs\temptales</h1>
</body>
</html>

修改DIRS里的地址为D:\Envs\temptales:

'DIRS': [r"D:\Envs\temptales"], #os.path.join(BASE_DIR,'templates')

效果如下:
在这里插入图片描述
经过验证,DIRS里的地址不一定是项目里的静态页面,也可以项目外的,只要路径写对即可,但是一般都不会把模板路径写在项目外

2.APP_DIRS

默认为True,这个设置为True后,会在INSTALLED_APPS的安装了的APP下的templates文件加中查找模板

settings.py中INSTALLED_APPS数组中添加你的app名字

先在book这个app下新建一个templates文件夹,并新建一个前端页面:
在这里插入图片描述

把DIRS里的地址删掉,在INSTALLED_APPS列表里写上app的名字:
在这里插入图片描述
这样就算安装成功了,重启一下查看效果:
在这里插入图片描述

查找顺序

比如代码render(‘list.html’)

先会在DIRS这个列表中依次查找路径下有没有这个模板,如果有,就返回。

如果DIRS列表中所有的路径都没有找到,那么会先检查当前这个视图所处的app是否已经安装,如果已经安装了,那么就先在当前这个app下的templates文件夹中查找模板,如果没有找到,那么会在其他已经安装了的app中查找。

如果所有路径下都没有找到,那么会抛出一个TemplateDoesNotExist的异常。

2. 模板变量

前面讲的内容还只是传静态页面,在实际项目中,会经常要把数据库查询到的内容显示在页面中,这时就需要传参

模板中可以包含变量,Django在渲染模板的时候,可以传递变量对应的值过去进行替换。

变量的命名规范和Python非常类似,只能是阿拉伯数字和英文字符以及下划线的组合,不能出现标点符号等特殊字符。

变量需要通过视图函数渲染,视图函数在使用render或者render_to_string的时候可以传递一个context的参数,这个参数是一个字典类型:

book\views.py:

def index(request):
    content = {
   "name":"zbp"}
    html = render_to_string("index.html", context=content)

    return HttpResponse(html)

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>这是book下的前端界面</h1>
    <h2>{
   {
    name }}</h2>
</body>
</html>

在HTML文件里的变动主要是加上这句话:{ { name }},这里要注意的是,要用两个花括号,并且python字典的取值是键值对,因此里面直接写字典{“key”:value}里的key即可:
在这里插入图片描述
如果这是一个嵌套字典:

content = {
   "name":{
   "zbp":20}}

那么可以用点的形式取值:

<h2>{
   {
    name.zbp }}</h2>

效果如下:
在这里插入图片描述
如果嵌套的是列表:

 content = {
   
     'persons':[
         'a',
         'b',
         'c'
     ]
 }

也需要用点的形式取值:

<h2>{
   {
    persons.0 }}</h2>

效果如下:
在这里插入图片描述
另外,元组、对象都是可以的,唯一不能上传的是集合

通过以上的例子,我们可以有下面的总结,模板是按照以下方式进行解析的:

  1. 如果person是一个字典,那么就会查找这个字典的username这个key对应的值。
  2. 如果person是一个对象,那么就会查找这个对象的username属性,或者是username这个方法。
  3. 如果出现的是person.1,会判断persons是否是一个列表或者元组或者任意的可以通过下标访问的对象,
    如果是的话就取这个列表的第1个值。如果不是就获取到的是一个空的字符串。

注意:

不能通过中括号的形式访问字典和列表中的值,比如dict[‘key’]和list[1]是不支持的!

因为使用点(.)语法获取对象值的时候,可以获取这个对象的属性,如果这个对象是一个字典,也可以获取这个字典的值。所以在给这个字典添加key的时候,千万不能和字典中的一些属性重复。比如items,items是字典的方法,那么如果给这个字典添加一个items作为key,那么以后就不能再通过item来访问这个字典的键值对了

3. 模板标签

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Mr.郑先生_

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值