Flask---Jinja2模板引擎

最新推荐文章于 2022-02-05 19:05:16 发布

CodingAndCoCoding

最新推荐文章于 2022-02-05 19:05:16 发布

阅读量268

点赞数

分类专栏： Flask Python

本文链接：https://blog.csdn.net/Wangtuo1115/article/details/104698379

版权

Python 同时被 2 个专栏收录

43 篇文章 0 订阅

订阅专栏

Flask

7 篇文章 2 订阅

订阅专栏

文章目录

什么是Jinja2模板引擎？
Jinja2语法
Flask模板引擎Jinja2案例（代码）

什么是Jinja2模板引擎？

官方网址: http://docs.jinkan.org/docs/jinja2/ Jinja2 是一个现代的，设计者友好的，仿照 Django 模板的 Python 模板语言。它速度快，被广泛使用，并且提供了可选的沙箱模板执行环境保证安全:

python的Web开发中，业务逻辑(实质就是视图函数的内容)和页面逻辑(html件)分开的，使得代码的可读性增强，代码容易理解和维护；
模板渲染: 在html文件中，通过动态赋值，将重新翻译好的html文件(模板引擎生效) 返回给用户的过程。
其他的模板引擎: Mako, Template, Jinja2

Jinja2语法

1、Jinja2变量显示语法：

{{ 变量名|函数调用 }}
有下面三种显示方式：
{{ name }} {{ url_for()}} {{ get_flashed_messages() }}

2、Jinja2变量内置过滤器：
完整的过滤查看位置： http://jinja.pocoo.org/docs/templates/#builtin-filters

safe 渲染值时不转义
capitalize 把值的首字母转换成大写,其他字母转换成小写
lower 把值转换成小写形式
upper 把值转换成大写形式
title 把值中每个单词的首字母都转换成大写
trim 把值的首尾空格去掉
striptags 渲染之前把值中所有的 HTML 标签都删掉

3、如何自定义过滤器？
for循环：

        {% for i in li%}
            xxx
        {% endfor %}

if语句：

{% if user == 'westos'%}
            xxxx
        {% elif user == 'hello' %}
            xxx
        {% else %}
            xxx
        {% endif%}

4、宏的操作
宏相当于函数。
如何定义宏？

        <!--相当于python里面的定义函数, 后面使用的场景: 分页显示-->
        {%  macro render(id) %}
            <h1>hello world {{ id }}</h1>
        {% endmacro %}

如何调用宏？

    <!--调用定义好的宏(类似于python中的函数)-->
    {{ render(1) }}
    {{ render(2) }}
    {{ render(3) }}

5、incude包含操作
如何使用: {% include “xxxx.html” %}

6、模板的继承
一般网站的导航栏和底部不会变化，为了避免重复编写导航栏信息;

如何定义模板？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}  {% endblock %}</title>
</head>
<body>
<div style="width: 100px; height: 200px" > 这是导航栏</div>
{% block body %}
hello
{% endblock %}
<div style="width: 100px; height: 200px" >这是底部</div>
</body>
</html>

如何继承基模板？

{% extends  '06_base.html'%}
{% block title %}
    继承案例
{% endblock %}
{% block body %}
<span style="color: green">这是最新填的block内容</span>
{% endblock %}

Flask模板引擎Jinja2案例（代码）

通长我们将html文件放在项目中的templates目录中，将静态文件放在static目录中，比如css，js，font，img等放在static目录下。
主程序：

from flask import Flask,render_template

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/bbs/')
def bbs():
    return render_template('/bbs.html/')

@app.route('/blog/')
def blog():
    return render_template('/blog.html/')

if __name__ == '__main__':
    app.run()

基模板html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %}</title>
    <style>
        .nav{
            width: 100%;
            border: solid 1px green;
            height: 50px;
        }
        .left{
            width: 30%;
            border: solid 1px red;
            float: left;
            height: 80px;
        }
        .right{
            width: 69%;
            border: solid 1px black;
            float: left;
            height: 80px;
        }
    </style>
</head>
<body>
<div class="nav" align="center">
    导航栏
    <button>登录</button>
    <button>注销</button>
</div>
# 定义一个类，包含left.html文件
<div class="left">
{%  include 'left.html' %}
</div>
<div class="right">
{% block body %}
    {% endblock %}
</div>

</body>
</html>

模板继承—bbs.html

##继承模板
{% extends 'base.html' %}
{% block title %}
论坛
{% endblock %}

{% block body %}
<h1>bbs</h1>
{% endblock %}

blog.html和index.html两者和bbs.html内容相似.
letf.html
内容随便写点，能够说明问题即可。

<ul>
    <li>Java</li>
    <li>C++</li>
    <li>Python</li>
</ul>

最后的结果显示如下：
在这里插入图片描述

Jinja2测试
主程序：


from flask import Flask,render_template

app = Flask(__name__)

@app.route('/')
def index():
    text = """
    <h1>hello world</h1>
    
    """
    return render_template('jinja2.html',text=text)

if __name__ == '__main__':
    app.run()

jinja2_base.html文件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %} {% endblock %}</title>
</head>
<body>
<div style="width: 100px; height: 200px">这是导航栏</div>
{% block body %}
hello
{% endblock %}
<div style="width: 100px; height: 200px" >这是底部</div>
</body>
</html>

jinja2.html文件：
包括宏的定义和调用，继承和包含操作。

{% extends 'jinja2_base.html' %}

{% block title %} 主页 {% endblock %}

{% block body %}
    {% include "left.html" %}
    {#    声明jinja2的宏#}
    {% macro fun(id) %}
        <h1> hello {{ id }}</h1>
    {% endmacro %}

    {{ text | safe }}
    {{ text | striptags }}

    {{ fun(1) }}
    {{ fun(2) }}
    {{ fun(3) }}

{% endblock %}

最后的效果如图：
在这里插入图片描述

CodingAndCoCoding

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Flask---Jinja2模板引擎

文章目录什么是Jinja2模板引擎？Jinja2语法Flask模板引擎Jinja2案例（代码）什么是Jinja2模板引擎？官方网址: http://docs.jinkan.org/docs/jinja2/ Jinja2 是一个现代的，设计者友好的，仿照 Django 模板的 Python 模板语言。它速度快，被广泛使用，并且提供了可选的沙箱模板执行环境保证安全:python的Web开发中...
复制链接

扫一扫