一,Flask模板介绍
1. 什么是flask模板:
——理解渲染机制:
没有模板渲染函数的话怎么在浏览器中显示html文件呢?
(1)从磁盘中读取html字符串
(2)将满足特定规则的内容进行替换
(3)发送给浏览器进行显示
@app.route('/html/show')
def html_show():
""" 理解渲染机制 """
# 1.找到html磁盘上的文件地址(全路径)
file_name = os.path.join(os.path.dirname(__file__), 'templates', 'index.html')
print(file_name)
# 2.读取html文件中的内容
now_time = datetime.now().strftime('%Y-%m-%d %H:%M:%S')
with open(file_name, 'r', encoding='utf-8') as f:
html = f.read()
# 3. 替换html中的特定内容
html = html.replace('{{ now_time }}', now_time)
# 3. 将html内容发送给浏览器
return html
——模板其实是一个包含响应文本的文件,其中用占位符(变量)表示动态部分,告诉模板引擎其具体的值需要从使用的数据中获取
——使用真实值替换变量,再返回最终得到的字符串,这个过程称为渲染
2.为什么学习它
——使代码更加便于维护
3.它有哪些内容
二,模板及模板引擎介绍
1. 模板引擎:
——Flask使用Jinjia2作为默认模板引擎
——默认配置
@app.route('/hello')
def hello():
""" 把html文件的内容在浏览器中展示出来 """
user = {
'name': '张三'
}
#return render_template('hello.html', user=user)
html = """<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
hello
</body>
</html>"""
return render_template_string(html)
2. 什么是转义:
——把有特殊意义的字符显示出来
3.全局对象
4.全局函数
5. 上下文处理器
三,模板变量的使用
1. 回顾:渲染机制
(1)从磁盘读取html字符串
(2)将满足特定规则的内容进行替换
(3)发送给浏览器展示
2.模板中变量的使用
——普通类型的数据渲染
@app.route('/user')
def user_info():
# 普通数据类型的渲染
name = "张三"
age = 46
city = "北京"
return render_template('user.html', name=name, age=age, city=city)
<body>
<p>普通数据类型的渲染</p>
<p>姓名:{{ name }} - 年龄:{{ age }} - 地址:{{ city }}</p>
</body>
——dict数据类型的渲染
# dict数据类型的渲染
user_info = {
'nickname': '汤姆',
'sex': '男',
'address': '北京市朝阳区'
}
<h2>dict数据类型的渲染</h2>
<p>英文名:{{ user_info.nickname }} — 性别:{{ user_info.sex }} — 详细地址:{{ user_info.address }}</p>
——list和tuple数据类型的渲染
# list数据类型的渲染
list_user = [
'张三', '李四', '王五', '赵六'
]
# tuple数据类型的渲染
tuple_city = (
'北京', '上海', '天津', '广州'
)
<h2>list数据类型的渲染</h2>
<p>{{ list_user[0], list_user[2], list_user[3] }} {{ list_user[1] }}</p>
<h2>tuple数据类型的渲染</h2>
<p>{{ tuple_city[0], tuple_city[1], tuple_city[2], tuple_city[3] }}</p>
——复杂数据类型的渲染
# 复杂数据类型的渲染
list_info = [
{
'username': '张三',
'address': {
'city': '广州'
}
},
{
'username': '李四',
'address': {
'city': '上海'
}
}
]
<h2>复杂数据类型的渲染</h2>
<p>{{ list_info[0].username }} - {{ list_info[0].address['city'] }}</p>
<p>{{ list_info[1].username }} - {{ list_info[1].address['city'] }}</p>
——思考:长度为100的list对象如何渲染
学习使用模板标签
四,模板语法之模板标签
1. 模板语法的内容:
——模板标签
——过滤器
——模板全局函数
2.模板标签的语法:
1. {% tag %}
2. {% tag %}
内容
{% endtag %}
3. 内置的判断条件:
4.if标签中其他逻辑控制
5.for循环
@app.route('/for')
def for_info():
list_info = [
{
'username': '张三',
'address': '广州',
'sex': '男'
},
{
'username': '王五',
'address': '广西'
},
{
'username': '赵六',
'address': '广西'
},
{
'username': '小米',
'address': '广州',
'sex': '男'
},
{
'username': '王动',
'address': '广西'
},
{
'username': '流气',
'address': '广西'
}
]
return render_template('for.html', list_info=list_info)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
.odd{
background-color: red;
}
.even{
background-color: aqua;
}
</style>
</head>
<body>
<h2>for循环</h2>
{% for item in list_info %}
<p>{{ item.username }} - {{ item.address }}</p>
{% endfor %}
<h2>for循环 dict</h2>
{% for item in list_info %}
<p class="{{ loop.cycle('odd', 'even') }}">
第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
{% for key, value in item.items() %}
{{ key }} - {{ value }}
{% endfor %}
</p>
{% endfor %}
<h2>for循环中使用break和continue</h2>
{% for item in list_info %}
<p>第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
{% for key, value in item.items() %}
{% if loop.index > 2 %}
{% break %}
{% endif %}
{{ key }} - {{ value }}
</p>
{% endfor %}
{% else %}
<p>用户信息为空</p>
{% endfor %}
<!-- 我是HTML注释 -->
{# 我是模板注释 #}
</body>
</html>
6.for循环体内的变量
7.如何在for循环中使用break和continue
# 为模板引擎添加扩展
app.jinja_env.add_extension('jinja2.ext.loopcontrols')
<h2>for循环中使用break和continue</h2>
{% for item in list_info %}
<p>第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
{% for key, value in item.items() %}
{% if loop.index > 2 %}
{% break %}
{% endif %}
{{ key }} - {{ value }}
</p>
{% endfor %}
{% else %}
<p>用户信息为空</p>
{% endfor %}
8.添加注释以及取消HTML中多余的空白
9.设置变量
10,转义显示
五,模板语法之过滤器:
1.过滤器的使用
——方式一:用管道符号( | )
{{value | safe}}
——方式二:使用标签
{% filter upper %}
this is a filter
{% endfilter %}
2.内置的过滤器
重点:自定义过滤器
——方式一:使用装饰器注册
@app.template_filter('reverse')
def reverse_filter(s):
return s[::-1]
——方式二:调用函数注册
def reverse_filter(s):
return s[::-1]
app.jinja_env.filters['revers'] = reverse_filter
@app.route('/filter')
def user_filter():
phone_num = '18835170000'
str = '张三'
return render_template('filter.html', phone_num=phone_num, str=str)
@app.template_filter('filter')
def reverse_filter(s):
return s[::-1]
def phone_num(number):
return number[0:3] + '****' + number[7:]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>过滤器的使用</h2>
<p>{{ phone_num|phone_num }}</p>
<p>{{ str|filter }}</p>
</body>
</html>
六,模板语法之全局函数
1. 全局函数介绍
——全局函数可以在模板中直接调用
——示例
2. 模板全局函数
3. 模板中的宏:
什么是宏?
——把常用的功能抽取出来,实现可重用
——简单理解 宏约等于函数
——宏可以写在单独的HTML中
定义宏:
调用宏:
文件中宏的使用:
4. 模板的继承
(1)为什么要对模板进行抽象和继承
(2)如下场景应该怎样实现?
每个页面都引用了公共的头部,js,css
有几个页面和内容结构及其相似(如:导航菜单)
(3)继承的实现
5. 模板的包含
-->使用模板的包含语法
包含实现:
6. 消息闪现