概述:模板就是按照特定规则书写的负责展示效果的HTML文件,模板引擎就是特定规则的解释和替换的工具jinja2;flask的模板引擎使用的就是jinja2的模板引擎,它是由flask核心开发组成员开发。
一、模板
1、工作目录
project/
manage.py/ 项目启动控制文件
templates/ 模板文件的目录
2、渲染模板
方法1:render_template
视图文件
# 视图文件
@app.route('/')
def index():
return render_template('index.html')
模板文件
首页
hello world!
方法2:render_template_string
# 视图文件
@app.route('/')
def index():
render_template_string('你好,世界!
')
使用变量
# 视图函数
@app.route('/')
def index():
return render_template('index.html', name='marry', age=25)
# 模板渲染
首页
{{ name}}--{{ age}}
注意:如果传入的变量不存在,则在模板中插入空白字符。
主体结构:
{% if 条件 %}
pass
{% elif 条件 %}
pass
{% else %}
pass
{% endif %}
实例:
{% if age<=18 %}
{{ name }}用户为儿童用户
{% elif age<=30 %}
{{ name }}用户为青年用户
{% elif age<=60 %}
{{ name }}用户为中年用户
{% else%}
{{ name }}用户为老年用户
{% endif %}
实例1:迭代列表
{% for i in myRange %}
第{{ i }}次迭代
{% else %}
没有找到该变量
{% endfor %}
实例2:迭代字典
{% for key,value in myInfo.items() %}
我的{{ key }}是{{ value }},
{% else %}
没有找到该变量
{% endfor %}
变量:for循环中还包含了一些变量,用来获取当前变量状态。
变量 | 描述 |
loop.index | 当前迭代的索引从1开始 |
loop.index0 | 当前迭代的索引从0开始 |
loop.first | 是否为第一次迭代,如果是则返回True |
loop.last | 是否为最后一次迭代,如果是则返回True |
loop.length | 迭代的长度 |
实例:
{% for item in myRange %}
{{ loop.index }}--
{{ loop.index0 }}--
{{ loop.first }}--
{{ loop.last }}--
{{ loop.length }}
{% endfor %}
注意:
格式:
{# 注释内容 #}
注意:注释的代码不会在浏览器中的html中显示出来
include语句可以把一个模板引入到另外一个模板,类似于把一个不安的代码copy到另外一个模板的指定位置中实现模板代码的复用;
header.html
我是头部
footer.html
test_include.html
test_include
{% include 'common/header.html' %}
我是中间主体部分
{% include 'common/footer.html' %}
类似于python中的函数,可以封装一段特殊功能的html代码。
{% macro test(name='关羽',age=25) %}
我的名字叫{{ name }},我今年{{ age }}岁了!
{% endmacro %}
{{ test(name='张飞',age=27) }} # 传参
{{ test() }} # 使用默认参数
宏的导入
{% macro test(name='关羽',age=25) %}
我的名字叫{{ name }},我今年{{ age }}岁了!
{% endmacro %}
宏的调用
{% from 'common/pubilc_macro.html' import test %}
{{ test() }}
{% from 'common/pubilc_macro.html' import test as t1 %}
{{ t1() }}
{% import 'common/pubilc_macro.html' as t1 %}
{{ t1.test()}}
flask中的模板可以继承,通过继承可以把模板中许多重复出现的元素抽取出来,放在父亲模板中,并且父亲模板通过定义block给自模板开一口,自末班根据需要再实现block
视图函数:
@app.route('/')
def hello():
return render_template('hello.html')
父模板:base.html
{% block title %}父模板{% endblock %}
{% block context %}我是父模板中的内容
{% endblock %}
子模板:hello.html
{% extends 'common/base.html' %}
{% block title %}子模板{% endblock %}
{% block context %}
{{ super() }}
我是子模板
{% endblock %}
安装:
pip install flask-bootstrap
实例化bootstrap对象:
from flask import Flask,redirect,url_for,render_template,render_template_string,request
from flask_script import Manager
from flask_bootstrap import Bootstrap
app = Flask(__name__)
Bootstrap(app=app) # 实例化bootstrap对象
manager=Manager(app)
查看flask-bootstrap扩展库的base.html
{% block doc -%}
{%- block html %}
{%- block head %}
{% block title %}{{title|default}}{% endblock title %}
{%- block metas %}
{%- endblock metas %}
{%- block styles %}
{%- endblock styles %}
{%- endblock head %}
{% block body -%}
{% block navbar %}
{%- endblock navbar %}
{% block content -%}
{%- endblock content %}
{% block scripts %}
{%- endblock scripts %}
{%- endblock body %}
{%- endblock html %}
{% endblock doc -%}
继承bootstrap库中的base.html,并替换部分内容
{% extends 'bootstrap/base.html' %}
{% block title %}我是bootstrap替换后的标题{% endblock %}
{% block content %}我是bootstrap替换后的导航栏{% endblock %}
bootstrap库中所有block的作用
block |
说明 |
doc | 整个HTML文档 |
html | HTML内部所有代码 |
head | head标签 |
title | title标签 |
style | 引入css样式 |
metas | 一组meta标签 |
body | body标签 |
navbar | 用户自定义导航条 |
content | 用户自定义内容 |
scripts | 用户自定义js脚本 |
路由和视图函数
@app.route('/')
def hello():
return render_template('common/bootstrap_base.html')