基于python的Flask web开发 三:jinja2控制语句和模板的使用与继承

jinja2是基于python的一种模板引擎,具有很高的安全性。(很抽象,但是不影响学习和使用)。

一、jinja2的控制和循环语句

和C,C++,java相比jinja2的控制和循环语句的格式有所不同。

控制语句:                                                       循环语句:

{% if 表达式 %}                                                 {% for a in b %}

     操作                                                              操作

{% elif 表达式 %}                                                {% endfor %}

     操作

{% endif  %}

下面是一段存在flask项目template目录下的html代码,用到了jinja2的控制语句和循环语句。

#control.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Can you get married?</title>
</head>
<body>
    {% if age >= 22 %}
    <div>you can get married!</div>
    {% elif age < 21 %}
    <div>you can't get married!</div>
    {% else %}
    <div>you can get married,after one year</div>
    {% endif %}
    <ul>
         {% for hero in hero_name %}
         <div>{{ hero }}</div>
         {% endfor %}
    </ul>
{% for key,value in person.items()%}
   <div> {{ key }}:{{ value }}</div>
{% endfor %}
</body>
</html>

二、模板(template)

1.模板的简单使用——渲染界面

来说说模板template部分,现阶段我对模板的理解就是前端的html部分要放在模板中,然后在*.py文件中引入render_template扩展包,然后通过render_template("*.html")函数,来渲染界面。如果想要传变量给模板的化,先在函数中把变量定义字典,然后在render_template中 通过关键字context参数的方式获取,render_template("模板名称.html",**context)。想要传变量给模板的化,

先在函数中把变量定义字典,然后在render_template中 通过关键字context参数的方式获取,render_template("模板名称.html",**context),下面举一个例子。

#在url/control 下调用的视图函数,提供模板并且传入参数渲染界面
#control.html在上一段代码中
@app.route("/control",methods=['POST','GET'])
def control():
    context = {
        "age":20,
        'hero_name': ['1', '2', '3', '4'],
        "person":{"name":"lqm","age":20}
    }
    return render_template("control.html",**context)#传入变量

 页面渲染出来的结果:

 也就是说content内部的变量传进了模板中,在模板html代码中也可以使用age、hero_name、person.item()。

2.模板的继承

这里的继承和面向对象里的继承是有差异的,模板的继承就是说这些模板(html代码、界面)有相同的部分,这些部分只需要写一份然后其他模板继承这些相同的部分然后去实现各自不同的部分就好,我们现在去实现多个界面有相同的底部和目录来加强对模板继承的理解。父类模板在实现这些多个界面都用的部分以后会为子模板提供实现特异性部分的入口,例如{% block head %}{% endblock %}实现特异性标题,{% block body %} {% endblock %}实现特异性文档主题部分,{% block title %}{% endblock %}实现特异性网页名称,再继承模板时在代码除注释的第一行写{% extends "*.html" %}用来继承父类模板,然后再实现特异性部分即可。

#base.html 父类模板的实现代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %}</title>
    {% block head %}{% endblock %}#子类实现特异性标题入口
</head>
<body>
<ul>
    <li>
        <a href="/">首页</a>
    </li>
    <li>
        <a href="/control">控制</a>
    </li>
    <li>
        <a href="/about">关于</a>
    </li>
</ul>
{% block body %}{% endblock %}#子类实现特异性文档主体入口
<footer style="background-color: #0000df">flask</footer>
</body>
</html>
#control.html control子类模板代码实现
{% extends "base.html"%}

{% block title %}
      控制
{% endblock %}

{% block body %}
    {% if age >= 22 %}
    <div>you can get married!</div>
    {% elif age < 21 %}
    <div>you can't get married!</div>
    {% else %}
    <div>you can get married,after one year</div>
    {% endif %}
    <ul>
         {% for hero in hero_name %}
         <div>{{ hero }}</div>
         {% endfor %}
    </ul>
{% for key,value in person.items()%}
   <div> {{ key }}:{{ value }}</div>
{% endfor %}

{% endblock %}

首页界面效果图:

 

控制界面效果图:

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值