Flask模板语法与继承

最新推荐文章于 2024-04-22 00:33:11 发布

JAVA星球在逃Python人员

最新推荐文章于 2024-04-22 00:33:11 发布

阅读量556

点赞数

文章标签： flask python 后端

本文链接：https://blog.csdn.net/m0_63302973/article/details/127559561

版权

一，Flask模板介绍

1. 什么是flask模板：

——理解渲染机制：

没有模板渲染函数的话怎么在浏览器中显示html文件呢？

(1)从磁盘中读取html字符串

(2)将满足特定规则的内容进行替换

(3)发送给浏览器进行显示

@app.route('/html/show')
def html_show():
    """ 理解渲染机制 """
    # 1.找到html磁盘上的文件地址（全路径）
    file_name = os.path.join(os.path.dirname(__file__), 'templates', 'index.html')
    print(file_name)
    # 2.读取html文件中的内容
    now_time = datetime.now().strftime('%Y-%m-%d %H:%M:%S')
    with open(file_name, 'r', encoding='utf-8') as f:
        html = f.read()
        # 3. 替换html中的特定内容
        html = html.replace('{{ now_time }}', now_time)
        # 3. 将html内容发送给浏览器
        return html

——模板其实是一个包含响应文本的文件，其中用占位符（变量）表示动态部分，告诉模板引擎其具体的值需要从使用的数据中获取

——使用真实值替换变量，再返回最终得到的字符串，这个过程称为渲染

2.为什么学习它

——使代码更加便于维护

3.它有哪些内容

二，模板及模板引擎介绍

1. 模板引擎：

——Flask使用Jinjia2作为默认模板引擎

——默认配置

@app.route('/hello')
def hello():
    """ 把html文件的内容在浏览器中展示出来 """
    user = {
        'name': '张三'
    }

    #return render_template('hello.html', user=user)
    html = """<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  hello
</body>
</html>"""
    return render_template_string(html)

2. 什么是转义：

——把有特殊意义的字符显示出来

3.全局对象

4.全局函数

5. 上下文处理器

三，模板变量的使用

1. 回顾：渲染机制

（1）从磁盘读取html字符串

（2）将满足特定规则的内容进行替换

（3）发送给浏览器展示

2.模板中变量的使用

——普通类型的数据渲染

@app.route('/user')
def user_info():
    # 普通数据类型的渲染
    name = "张三"
    age = 46
    city = "北京"
    return render_template('user.html', name=name, age=age, city=city)



<body>
    <p>普通数据类型的渲染</p>
    <p>姓名：{{ name }} - 年龄：{{ age }} - 地址：{{ city }}</p>
</body>

——dict数据类型的渲染

# dict数据类型的渲染
    user_info = {
        'nickname': '汤姆',
        'sex': '男',
        'address': '北京市朝阳区'
    }


<h2>dict数据类型的渲染</h2>
    <p>英文名：{{ user_info.nickname }} — 性别：{{ user_info.sex }} — 详细地址：{{ user_info.address }}</p>

——list和tuple数据类型的渲染

# list数据类型的渲染
    list_user = [
        '张三', '李四', '王五', '赵六'
    ]

    # tuple数据类型的渲染
    tuple_city = (
        '北京', '上海', '天津', '广州'
    )


<h2>list数据类型的渲染</h2>
<p>{{ list_user[0], list_user[2], list_user[3] }} {{  list_user[1] }}</p>
<h2>tuple数据类型的渲染</h2>
<p>{{ tuple_city[0], tuple_city[1], tuple_city[2], tuple_city[3] }}</p>

——复杂数据类型的渲染

# 复杂数据类型的渲染
    list_info = [
        {
            'username': '张三',
            'address': {
                'city': '广州'
            }
        },
        {
            'username': '李四',
            'address': {
                'city': '上海'
            }
        }
    ]



    <h2>复杂数据类型的渲染</h2>
    <p>{{ list_info[0].username }} -  {{ list_info[0].address['city'] }}</p>
    <p>{{ list_info[1].username }} -  {{ list_info[1].address['city'] }}</p>

——思考：长度为100的list对象如何渲染

学习使用模板标签

四，模板语法之模板标签

1. 模板语法的内容：

——模板标签

——过滤器

——模板全局函数

2.模板标签的语法：

1. {% tag %}

2. {% tag %}
   内容
   {% endtag %}

3. 内置的判断条件：

4.if标签中其他逻辑控制

5.for循环

@app.route('/for')
def for_info():
    list_info = [
        {
            'username': '张三',
            'address': '广州',
            'sex': '男'
        },
        {
            'username': '王五',
            'address': '广西'

        },
        {
            'username': '赵六',
            'address': '广西'

        },
        {
            'username': '小米',
            'address': '广州',
            'sex': '男'
        },
        {
            'username': '王动',
            'address': '广西'

        },
        {
            'username': '流气',
            'address': '广西'

        }
    ]
    return render_template('for.html', list_info=list_info)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        .odd{
            background-color: red;
        }
        .even{
            background-color: aqua;
        }
    </style>
</head>
<body>
    <h2>for循环</h2>
    {% for item in list_info %}
        <p>{{ item.username }} - {{ item.address }}</p>
    {% endfor %}
    <h2>for循环 dict</h2>
    {% for item in list_info %}
        <p class="{{ loop.cycle('odd', 'even') }}">
        第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
        {% for key, value in item.items() %}
        {{ key }} - {{ value }}
        {% endfor %}
        </p>
    {% endfor %}
    <h2>for循环中使用break和continue</h2>
    {% for item in list_info %}
        <p>第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
        {% for key, value in item.items() %}
            {% if loop.index > 2  %}
                {% break %}
            {% endif %}
            {{ key }} - {{ value }}
        </p>
        {% endfor %}
    {% else %}
        <p>用户信息为空</p>
    {% endfor %}

    <!-- 我是HTML注释 -->
    {# 我是模板注释 #}
</body>
</html>

6.for循环体内的变量

7.如何在for循环中使用break和continue

# 为模板引擎添加扩展
app.jinja_env.add_extension('jinja2.ext.loopcontrols')



<h2>for循环中使用break和continue</h2>
    {% for item in list_info %}
        <p>第{{ loop.index }}个用户,总共{{ loop.length }}个用户<br/>
        {% for key, value in item.items() %}
            {% if loop.index > 2  %}
                {% break %}
            {% endif %}
            {{ key }} - {{ value }}
        </p>
        {% endfor %}
    {% else %}
        <p>用户信息为空</p>
    {% endfor %}

8.添加注释以及取消HTML中多余的空白

9.设置变量

10，转义显示

五，模板语法之过滤器：

1.过滤器的使用

——方式一：用管道符号（ | ）

——方式二：使用标签

{% filter upper %}

this is a filter

{% endfilter %}

2.内置的过滤器

重点：自定义过滤器

——方式一：使用装饰器注册

@app.template_filter('reverse')

def reverse_filter(s):

return s[::-1]

——方式二：调用函数注册

def reverse_filter(s):

return s[::-1]

app.jinja_env.filters['revers'] = reverse_filter

@app.route('/filter')
def user_filter():
    phone_num = '18835170000'
    str = '张三'
    return render_template('filter.html', phone_num=phone_num, str=str)


@app.template_filter('filter')
def reverse_filter(s):
    return s[::-1]


def phone_num(number):
    return number[0:3] + '****' + number[7:]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h2>过滤器的使用</h2>
    <p>{{ phone_num|phone_num }}</p>
    <p>{{ str|filter }}</p>
</body>
</html>