Flask深入了解Jinja2引擎的用法

2022-07-28 14:04:00
目录
Jinja2Jinja2语句扩展Jinja2模板继承

Jinja2

想象一下这样一个场景,如果对于某个网站来说,如果你充值了Vip,你才可以看到隐藏内容了。你该怎么做呢?

这个适合就需要jinja2的出场了

先写一份代码,根据姓名渲染一个网页,然后把姓名和vip变量传入HTML模板中。

注意使用jinja2的HTML页面是不能用浏览器直接打开的,必须要启动Flask,使用路由返回页面

from flask import Flask, render_template
app = Flask(__name__)
@app.route('/space/<name>')
def space(name):
    vip = True
    return render_template("space.html", name=name, vip=vip)
if __name__ == '__main__':
    app.run(debug=True)

当html模板,接收到flask传递过来的name、vip参数,在html中如何使用呢?

    使用{{ }}装载一个变量,比如文中使用{{ name }}在html中装载name变量使用{% %}装载一个语句,对于if语句的格式如下面的代码的8-11行,必须要以{% if xxx %},以{% endif %}结尾。
    <!doctype html>
    <html lang="en">
    <head>
        <title>Hello from Flask</title>
    </head>
    <body>
        <h1>Hello {{ name }}!</h1>
        <!-- jinja2的if语句 -->
        {% if vip %}
            <h3>吆西,你触发了,隐藏内容啦!</h3>
        {% endif %}
    </body>
    </html>
    

    Jinja2语句扩展

    先说一下最终的结论:jinja2中装载变量使用{{>

    在html中,我们装载的变量,还有可能是一个列表,一个对象,一个字典等类型。

    我们装载的方式如下所示:

    # python
    a = [1,2,3]
    b = Cat(name="Tom")
    c = {"name":"Jackson"}
    # html
    <h1>Hello {{ a[0] }}!</h1>
    <h1>Hello {{ b.name }}!</h1>
    <h1>Hello {{ c['name '] }}!</h1>
    

    # 输出结果
    Hello 1!
    Hello Tom!
    Hello Jackson!

    在html中,不仅仅要使用if语句,还有一个更重要的循环语句。jinja2的循环语句如下所示:

         {% for item in navigation %}
             <li><a href="{{ item.href }}" rel="external nofollow" >{{ item.caption }}</a></li>
         {% endfor %}

    上面的代码生成了len(navigation )个li,每个li都指向item.href的链接。

    都看到这里了,点个赞白!

    Jinja2模板继承

    Jinja2的模板继承其实和对象的继承有一些相似的地方。比如,可以减少很多冗余的代码。接下来,我将展示一个Jinja2模板继承的小例子:

    我们创建一个base.html,书写如下代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <link rel="stylesheet" href="base.css" rel="external nofollow"  />
        <title>{% block title %}{% endblock %}</title>
        {% block head %}{% endblock %}
    </head>
    <body>
        <div id="body">{% block body %}{% endblock %}</div>
    </body>
    </html>
    

    在上述代码中,{% block xxx %} {% endblock %}表示开一个卡槽,方便后续页面进行填写。

    接下来,编写一个index.html继承base.html页面,具体方式如下所示:

    {% extends "base.html" %}
    {% block title %}首页{% endblock %}
    {% block body %}
        <h1>这里是首页</h1>
        <p class="detail">
          首页的内容
        </p>
    {% endblock %}  
    

    {% extends “base.html” %} 表示继承base.html模板

    {% block title %}首页{% endblock %} 表示使用title卡槽。

    首页是卡槽的内容 body 卡槽也是一样的

    到此这篇关于Flask深入了解Jinja2引擎的用法的文章就介绍到这了,更多相关Flask Jinja2内容请搜索易采站长站以前的文章或继续浏览下面的相关文章希望大家以后多多支持易采站长站!