-1.理解上下文
- render（）渲染
- request url传来的reuqest
- x.html 制定返回的模板名称
- context 上下文 数据库中 替换数据
0.大框架
1.创建模板
（1）创建templates和static文件夹
- 在firstapp中创建文件夹
（2）setting.py设置文件迁移
'DIRS': [os.path.join(BASE_DIR,'templates').replace('\','/')],
（3）引入静态文件：模板语言（错误：看下面）
{% staticfiles %}
#css文件目录
<link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">
#图片目录
<img src="{% static 'images/banner.jpg'%}" alt="" />
2.创建后台
(1)查看后台
（2）创建超级管理员
PS C:UsersAdministratorDesktop ootfirstsite> python.exe .manage.py createsuperuser Username (leave blank to use 'administrator'): admin Email address: 空 Password: admind Password (again): admin Superuser created successfully.
（3）向后台注册提交数据库
from django.contrib import admin from firstapp.models import People # Register your models here. admin.site.register(People)
（4）添加数据,并显示
（5）添加Article表，
class Aritcle(models.Model):
headline = models.CharField(null=True,blank=True,max_length=500)
content = models.TextField(null=True, blank=True)
def __str__(self):
return self.headline
- 后台注册提交
- 创建数据库，
tsite> python.exe .manage.py makemigrations rootfirstsite> python.exe .manage.py migrate
- 创建文章
3.Model引入数据
（1）view.py 文件导入Article
（2）创建index视图函数
（3）获取数据库的数据
article_list = Aritcle.objects.all() #获取Article数据库所有的数据
（4）render（请求 ，网页，上下文） 函数渲染好一个网页
def index(request):
article_list = Aritcle.objects.all() #获取Article数据库所有的数据
web_page = render(request,'first.html',context)
return web_page
（5）上下文：字典装载数据
- context['article_list'] = article_list
（6）代码：view.py文件
from django.shortcuts import render,HttpResponse from firstapp.models import People,Aritcle from django.template import Context,Template # Create your views here. def first_try(request): person = People(name='alxe',job='it') html_string = ''' <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>first_try</title> </head> <body> <h1>Hello</h1> <h3> {{ person.name }} </h3> </body> </html> ''' t = Template(html_string) c = Context({'person':person}) web_page = t.render(c) return HttpResponse(web_page) context = {} context['article_list'] = article_list def index(request): context = {} article_list = Aritcle.objects.all() #获取Article数据库所有的数据 context['article_list'] = article_list index_page = render(request,'first.html',context) return index_page
4.Django模板语言
（1）模板语言渲染html
{% for article in article_list %}
<div class="ui vertical segment">
<div class="ui container segment">
<h1 class="ui header">{{article.headline}} </h1>
<p>
{{ article.context }}
</p>
<button type="button" name="button" class="ui inverted blue button">Read more</button>
</div>
</div>
{% endfor %}
（2）ur.pyl添加地址
from django.conf.urls import include, url
from django.contrib import admin
from firstapp.views import first_try,index
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^first_try/', first_try),
url(r'^index/', index,name='index'),
]
5.效果演示
（1）报错
（2）修改bug
（3）无法加载css image
（4）静态文件导入路径错误
'DIRS': [os.path.join(BASE_DIR,'templates').replace('\','/')],
<link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">
<img src="{% static 'images/banner.jpg'%}" alt="" />
（5）templates 和static 文件夹 在firstapp中创建
（6）完整代码html
<!DOCTYPE html> {% load staticfiles %} <html> <head> <meta charset="utf-8"> <title>first web</title> <link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8"> </head> <body> <div class="ui inverted vertical segment"> <div class="ui image"> <img src="{% static 'images/banner.jpg'%}" alt="" /> </div> </div> {% for article in article_list %} <div class="ui vertical segment"> <div class="ui container segment"> <h1 class="ui header">{{article.headline}} </h1> <p> {{ article.content }} </p> <button type="button" name="button" class="ui inverted blue button">Read more</button> </div> </div> {% endfor %} <div class="ui inverted very padded segment"> maguacoding </div> </body> </html>
6.模板语言：过滤器100个字符
{{ article.content|truncatewords:100 }}
-
只能过滤英文
<!DOCTYPE html> {% load staticfiles %} <html> <head> <meta charset="utf-8"> <title>first web</title> <link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8"> </head> <body> <div class="ui inverted vertical segment"> <div class="ui image"> <img src="{% static 'images/banner.jpg'%}" alt="" /> </div> </div> {% for article in article_list %} <div class="ui vertical segment"> <div class="ui container segment"> <h1 class="ui header">{{article.headline}} </h1> <p> {{ article.content|truncatewords:100 }} </p> <button type="button" name="button" class="ui inverted blue button">Read more</button> </div> </div> {% endfor %} <div class="ui inverted very padded segment"> maguacoding </div> </body> </html>