创建视图
1 视图函数与网址对应
当我们在浏览器输入不同的网址, 对应着浏览器发出的不同的请求, 对于不同的请求, 我们都会编写对应的函数来处理浏览器的请求. 请求处理函数, 我们定义在应用的 views.py 模块中, 每一个处理请求的函数, 我们叫做视图函数.
该函数接收至少一个参数, 并且必须有返回值. 接收的参数类型为 HttpRequest 类型, 返回的数据类型必须为 HttpResponse 或者其子类.
我们下面在 goods 应用的 views.py 模块中, 创建一个视图函数 index, 代码如下:
代码语言:javascript复制from django.shortcuts import render
from django.http import HttpResponse
def index(request):
return HttpResponse('hello django!')
该视图函数处理方式非常简单, 只是向浏览器返回 "hello django" 字符串.
为了能够让浏览器能够看到 "hello django" 字符串, 我们必须配置 index 函数和那个请求网址对应. 下面我们网址和视图之间的配置:
1.首先打开 ttsx 目录下的 urls.py 模块中, 内容如下:
代码语言:javascript复制from django.conf.urls import include, url
from django.contrib import admin
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
]
在该模块中增加代码如下:
代码语言:javascript复制from django.conf.urls import include, url
from django.contrib import admin
from goods.views import index # 导入视图函数
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'^index/$', index)
]
代码的第一部分为 正则表达式, 第二部分 index, 表示前面正则如果匹配上则调用该视图函数. 那么 Django 是如何匹配网址的呢? 例如: 我们请求的网址是: localhost:8000/index/, Django 首先会去除域名部分, 也就是 localhost:8000/, 然后用余下的部分, 也就是 index/ 在 ttsx/urls.py 中的 urlpatterns 中逐个去判断那条正则表达式匹配请求的网址, 如果都不匹配则报错, 如果匹配, 则调用对应的视图函数.
代码语言:javascript复制 url(r'^index/$', index)
2. 启动开发服务器.
代码语言:javascript复制python manage.py runserver
3. 在浏览器输入网址.
代码语言:javascript复制localhost:8000/index/
浏览器显示效果如图12所示:
图12
2 模板渲染
如何返回一个漂亮的 HTML 页面呢? 我们可修改视图函数 index 如下:
代码语言:javascript复制from django.shortcuts import render
from django.http import HttpResponse
def index(request):
return HttpResponse('<h1>hello django!</h1>')
再次通过浏览器请求: localhost:8000/index/. 显示效果如图13所示:
图13
但是如果 HTML 文档比较大的话, 这种方式比较麻烦, 我们可以使用快捷函数 render 来返回一个 HTML 模板. 什么意思呢?
首先在 ttsx 目录下的 settings.py 模块中配置 HTML 模板文件的路径, 未修改之前如下:
代码语言:javascript复制TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
增加模板路径如下:
代码语言:javascript复制TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
其中
代码语言:javascript复制'DIRS': [os.path.join(BASE_DIR, 'templates')],
表示目录存放的目录在项目根目录的 templates 目录下. BASE_DIR 由 Django 定义的 项目根目录路径.
然后我们在项目根目录下创建 templates 目录, 并在该目录中创建一个模板文件 index.html, 内容如下:
代码语言:javascript复制<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>hello django!</h1>
</body>
</html>
修改 index 视图函数如下:
代码语言:javascript复制from django.shortcuts import render
from django.http import HttpResponse
def index(request):
return render(request, 'index.html')
图14
我们还可以通过 render 函数动态给 index.html 传递值, 并显示在模板中. 例如, 我们修改 index 视图函数如下:
代码语言:javascript复制from django.shortcuts import render
from django.http import HttpResponse
def index(request):
return render(request, 'index.html', {'name': '张三', 'age': 20})
我们在 index 视图函数给 index.html 模板传递一个参数, 该参数必须是字典类型. 那么在模板中如何显示该数据呢? 修改 index.html 如下:
代码语言:javascript复制<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
我的名字是: {{ name }}, 年龄是: {{ age }}.
</body>
</html>
在浏览器输入网址: localhost:8000/index/. 显示效果如图5所示:
图15
我们把数据填充到模板中的这一过程, 叫做模板渲染. 在模板中, 我们使用特殊的语法 "{{ 字典key名 }}" 来显示对应的数据.
3 静态文件
那么如何在模板中显示图片呢? 我们在项目的根目录下创建 static 目录, 然后在该目录下添加一张图片. 然后在 ttsx/ settings.py 中对图片文件存放路径进行配置:
代码语言:javascript复制STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
第一行配置是 Django 默认添加的, 第二行配置是我们新增的配置内容. 该配置表示, 当发现图片的网址路径是以 /static/ 开头的话, 那么就去 STATICFILES_DIRS 配置的路径下去搜索图片文件.
例如, 我们可修改 index.html 文件如下:
代码语言:javascript复制<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<img src="/static/default.jpg">
</body>
</html>
在浏览器输入网址: localhost:8000/index/. 显示效果如图16所示:
图16
除了图片文件, 例如 js、css等都叫做静态文件, 静态文件都可通过上述配置方式进行访问.