Flask 模板的使用

最新推荐文章于 2024-06-18 23:58:25 发布

Xiao@Bai

最新推荐文章于 2024-06-18 23:58:25 发布

阅读量284

点赞数

分类专栏： Python相关 Flask

本文链接：https://blog.youkuaiyun.com/weixin_44602192/article/details/117705876

版权

Python相关同时被 2 个专栏收录

36 篇文章

订阅专栏

Flask

6 篇文章

订阅专栏

本文介绍了如何在Flask应用中使用render_template方法渲染HTML模板，包括变量传递、控制块（if-else、for循环）、注释以及过滤器的使用。实例演示了数据绑定、列表和字典遍历以及模板中的条件表达式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

#! /usr/bin/python3
# -*- encoding:utf8 -*-

"""
Flask 模板的使用
1、使用render_template()方法调用Flask项目中的template目录中的HTML模板
    - render_template('HTML模板名', 变量 = 变量)
    - render_template在传变量参数时，变量没有变量的时候将会以空白字符串显示
2、HTML模板中获取View中的变量值的方法: {{ 变量名 }}
    - 变量的支持类型：（字符串、整型、列表、无组、字典、类对象)
    - {{ list.0 }} 同 {{ list[0]
    - {{ dict.key }} 同 {{ dict.get('key') }}
    - {{ class.属性 }} 同 {{ class.属性 }}
3、模板的控制块
    - {% if %} ... {% else %} ... {% endif %} - if 条件判断
    - {% for %} ... {% endfor %} - for 循环
4、HTML模板的注释
    - {# #} - 服务器端注释
    - {!-- --} - 前端浏览器注释
5、loop变量的使用
    - loop.index - 设置索引序号从1开始
    - loop.index0 - 索引序号从0开始
    - loop.reindex - 索引倒序
    - loop.first (布尔值) - 判断是否是第一行
    - loop.last (布尔值) - 判断是否是最后一行
6、HTML模板过滤器-Filter
    - filter - 过滤器本质就是一个函数
    - 使用语法：
       (1) {{ 变量名 | 过滤器(*args) }}
       (2) {{ 变量名 | 过滤器 }}
    - 常用的过滤器：
        - safe - 禁用转译html标签(如:<h1>、<a>....)(不可以和其他过滤器一起使用)
        - capitalize - 实现单词首字母大写
        - upper、lower - 字母大小写转换
        - title - 语句的单词首字母大写
        - reverse - 字符串反转
        - format - {{ '%s is %d' | format('str',int) }}
        - truncate(*args) -
        - 列表过虑器：
            - first - 获取列表第一个元素
            - last - 获取列表最后一个元素
            - length - 获取列表元素长度
            - sum - 整型数据求和
            - sort - 列表元素排序
        - 字典过滤器:
            - 使用{% for ... %} 对字典进行遍历获取字典中的数据值
            - {% for foo in foos %}  # 外循环遍历列表
                {% for k,v in foo.items() %}  # 内循环遍历字典
                    <p>{{ k }} -- {{ v}} </p>   
                {% endfor %}
              {% endfor %}
"""

from flask import Flask, render_template, request

app = Flask(__name__)

# 定义变量
name = 'ZhangSan'
age = 18
friends = ['LiSi', 'WangWu']
dict01 = {'key01': 'value01', 'key02': 'value02', 'key03': 'value03'}
girlfriend = Girl('XiaoMei', 'ShangHai')
girl_list = ['G1011', 'G20', 'G302', 'G4']
dict1 = {'name': 'XiaoEr', 'gender': '男', 'addr': 'ShangHai', 'Tel': '12312341234'}
dic_list = [
    {'name': 'XiaoEr', 'gender': '男', 'addr': 'ShangHai', 'Tel': '12312341234'},
    {'name': 'LiSi', 'gender': '男', 'addr': 'Beijing', 'Tel': '13312341234'},
    {'name': 'WangWu', 'gender': '男', 'addr': 'GuangZhou', 'Tel': '15312341234'},
    {'name': 'MaLiu', 'gender': '男', 'addr': 'WuHan', 'Tel': '18312341234'}
]

msg = '<h1>pyhton flask模板的使用</h1>'
word = 'python flask'


class Girl(object):
    def __init__(self, name, addr):
        self.name = name
        self.gender = '女'
        self.addr = addr

    def __str__(self):
        return self.name


@app.route('/show', endpoint='show')
def show_data():
    html = render_template('showData.html', name=name, age=age, friends=friends, dict01=dict01, girlfriend=girlfriend)
    return html


@app.route('/table', endpoint='showTable')
def showTable():
    return render_template('showTable.html', girls=girl_list, foos=dic_list)


@app.route('/filter')
def flaskFilter():
    return render_template('flaskFilter.html', girls=girl_list, msg=msg, word=word, foos=dic_list)


if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5002, debug=True)

showData.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ShowData</title>
</head>
<body>
业务数据展示
<table>
    {#动态创建数据表格#}

</table>
<p>
    用户名:{{ name }}
    <br>
    年龄: {{ age }}
    <br>
    朋友:
    <br>
    {# 列表数据的获取方法 #}
    {{ friends.0 }} <br>{{ friends.1 }}
    <br>
    {# 字典数据的获取方法 #}
    {{ dict01.key01 }}
    <br>
    {# 类对象 #}
    {{ girlfriend.name }} {{ girlfriend.addr }}
    <br>
</p>
</body>
</html>

ShowTable.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ShowTable</title>
    <style>
        .a {
            color: red;
            font-weight: bold;
        }



    </style>
</head>
<body>

模板的控制块
<ul>
    {% for girl in girls %}
    <li>{{ girl }}</li>
    {% endfor %}
</ul>

<ul>
    {% for girl in girls %}
    {% if girl | length <= 3 %}
    <li class="a"> {{ girl }}</li>
    {% else %}
    <li> {{ girl }}</li>
    {% endif %}

    {% endfor %}
</ul>
<table border="1" cellpadding="0" cellspacing="0" width="50%">
    {% for foo in foos %}
    <tr {% if loop.index % 2== 0 %} style="background-color:deeppink" {% endif %}>
        <td>{{ loop.index0 }}</td>
        <td>{{ foo.name }}</td>
        <td>{{ foo.gender }}</td>
        <td>{{ foo.addr }}</td>
        <td>{{ foo.Tel }}</td>
    </tr>

    {% endfor %}
</table>

</body>
</html>

flaskFilter.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Flask Temp Filter</title>
</head>
<body>
列表总数为:{{ girls | length }} 个 <br>

{{ msg | safe }} <br>
{{ word | lower }}<br>
{{ word | capitalize }}

<hr>
{# 列表的使用#}
{{ girls | first }} <br>
{{ girls | last }}

<hr>
{# 字典的使用 #}
{% for foo in foos %}
    {% for k,v in foo.items() %}
        <p>{{ k }} -- {{ v}} </p>
    {% endfor %}
{% endfor %}
</body>
</html>